fix(@vben/common-ui): 修复 JsonViewer 在 Vite 下因 CJS 默认导出未解包导致的渲染失败 (#7728)

* fix: lint

* fix(@vben/common-ui): 修复 JsonViewer 在 Vite 下因 CJS 默认导出未解包导致的渲染失败
pull/340/MERGE
过冬 2026-03-25 14:54:14 +08:00 committed by GitHub
parent 65287cf4b7
commit 7fbdf3d914
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 16 additions and 10 deletions

View File

@ -177,15 +177,15 @@ const computedProps = computed(() => {
// //
const computedHelp = computed(() => { const computedHelp = computed(() => {
return help ? onHelpFunc : undefined; const helpContent = help;
}); if (!helpContent) {
const onHelpFunc = () => {
if (!help) {
return undefined; return undefined;
} }
return isFunction(help) ? help(values.value, formApi!) : help; return () =>
}; isFunction(helpContent)
? helpContent(values.value, getFormApi())
: helpContent;
});
watch( watch(
() => computedProps.value?.autofocus, () => computedProps.value?.autofocus,

View File

@ -12,7 +12,7 @@ import type {
import { computed, useAttrs } from 'vue'; import { computed, useAttrs } from 'vue';
// @ts-expect-error - vue-json-viewer does not expose compatible typings for this import path // @ts-expect-error - vue-json-viewer does not expose compatible typings for this import path
import VueJsonViewer from 'vue-json-viewer'; import VueJsonViewerImport from 'vue-json-viewer';
import { $t } from '@vben/locales'; import { $t } from '@vben/locales';
@ -42,6 +42,11 @@ const emit = defineEmits<{
valueClick: [value: JsonViewerValue]; valueClick: [value: JsonViewerValue];
}>(); }>();
/** CJS/UMD 在 Vite 下解析为 { default: Component },需解包否则会出现 missing template or render */
const VueJsonViewer =
(VueJsonViewerImport as { default?: typeof VueJsonViewerImport }).default ??
VueJsonViewerImport;
const attrs: SetupContext['attrs'] = useAttrs(); const attrs: SetupContext['attrs'] = useAttrs();
function handleClick(event: MouseEvent) { function handleClick(event: MouseEvent) {

View File

@ -287,7 +287,9 @@ const [BaseForm, baseFormApi] = useVbenForm({
component: 'DatePicker', component: 'DatePicker',
fieldName: 'datePicker', fieldName: 'datePicker',
help: (values) => help: (values) =>
[`这是一个可输出其他字段值的帮助信息${values?.rate}`].map((v) => h('p', v)), [`这是一个可输出其他字段值的帮助信息${values?.rate}`].map((v) =>
h('p', v),
),
label: '日期选择框', label: '日期选择框',
}, },
{ {

View File

@ -187,4 +187,3 @@ catalog:
yaml-eslint-parser: ^2.0.0 yaml-eslint-parser: ^2.0.0
zod: ^3.25.76 zod: ^3.25.76
zod-defaults: 0.1.3 zod-defaults: 0.1.3