@qin-ui/element-plus-pro 1.4.2 → 1.4.4

package/es/shared/core/index.d.ts

@@ -1,5 +1,5 @@
 /**
  * 统一 re-export @qin-ui/pro-components-core，包内所有文件通过此文件引入 core 内容。
  */
-export { type AdditionalMethods, localePacks, normalizeColumn, normalizeColumns, useForm, createFormProxy, useTable, useSearchFormExpand, useFields, resolveFieldIdentity, DEFAULT_FIELD_IDENTITY_KEYS, useFormData, useFormRef, useReactiveAttrs, InjectionFormKey, InjectionFormSlotsKey, getObject, omitBy, get, set, normalizePathKey, toPath, camelizeProperties, cloneDeep, pick, omit, isPlainObject, isObjectItem, isPromise, zhCN, zhTW, enUS, format, resolveLocaleName, type ProLocale, type ProLocaleName, type ProLocaleKey, type Data, type Path, type Paths, type KeyExpandString, type ExtendWithAny, type DeepPartial, type PageParam, type Fields, type Form, type Table, type UseFieldsReturn, type UseFormDataReturn, type UseFormRefReturn, } from '@qin-ui/pro-components-core';
+export { type AdditionalMethods, localePacks, normalizeColumn, normalizeColumns, useForm, createFormProxy, useTable, useSearchFormExpand, useFields, resolveFieldIdentity, DEFAULT_FIELD_IDENTITY_KEYS, useFormData, useFormRef, useReactiveAttrs, InjectionFormKey, InjectionFormSlotsKey, getObject, mergeComponentVars, omitBy, get, set, normalizePathKey, toPath, camelizeProperties, cloneDeep, pick, omit, isPlainObject, isObjectItem, isPromise, callListeners, zhCN, zhTW, enUS, format, resolveLocaleName, type ProLocale, type ProLocaleName, type ProLocaleKey, type Data, type Path, type Paths, type KeyExpandString, type ExtendWithAny, type DeepPartial, type PageParam, type Fields, type Form, type Table, type UseFieldsReturn, type UseFormDataReturn, type UseFormRefReturn, } from '@qin-ui/pro-components-core';
 //# sourceMappingURL=index.d.ts.map

package/es/shared/core/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shared/core/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAEL,KAAK,iBAAiB,EACtB,WAAW,EACX,eAAe,EACf,gBAAgB,EAEhB,OAAO,EACP,eAAe,EACf,QAAQ,EACR,mBAAmB,EACnB,SAAS,EACT,oBAAoB,EACpB,2BAA2B,EAC3B,WAAW,EACX,UAAU,EACV,gBAAgB,EAEhB,gBAAgB,EAChB,qBAAqB,EAErB,SAAS,EACT,MAAM,EACN,GAAG,EACH,GAAG,EACH,gBAAgB,EAChB,MAAM,EACN,kBAAkB,EAClB,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,aAAa,EACb,YAAY,EACZ,SAAS,EAET,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,iBAAiB,EACjB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,YAAY,EAEjB,KAAK,IAAI,EACT,KAAK,IAAI,EACT,KAAK,KAAK,EACV,KAAK,eAAe,EACpB,KAAK,aAAa,EAClB,KAAK,WAAW,EAChB,KAAK,SAAS,EACd,KAAK,MAAM,EACX,KAAK,IAAI,EACT,KAAK,KAAK,EACV,KAAK,eAAe,EACpB,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,GACtB,MAAM,6BAA6B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shared/core/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAEL,KAAK,iBAAiB,EACtB,WAAW,EACX,eAAe,EACf,gBAAgB,EAEhB,OAAO,EACP,eAAe,EACf,QAAQ,EACR,mBAAmB,EACnB,SAAS,EACT,oBAAoB,EACpB,2BAA2B,EAC3B,WAAW,EACX,UAAU,EACV,gBAAgB,EAEhB,gBAAgB,EAChB,qBAAqB,EAErB,SAAS,EACT,kBAAkB,EAClB,MAAM,EACN,GAAG,EACH,GAAG,EACH,gBAAgB,EAChB,MAAM,EACN,kBAAkB,EAClB,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,aAAa,EACb,YAAY,EACZ,SAAS,EACT,aAAa,EAEb,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,iBAAiB,EACjB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,YAAY,EAEjB,KAAK,IAAI,EACT,KAAK,IAAI,EACT,KAAK,KAAK,EACV,KAAK,eAAe,EACpB,KAAK,aAAa,EAClB,KAAK,WAAW,EAChB,KAAK,SAAS,EACd,KAAK,MAAM,EACX,KAAK,IAAI,EACT,KAAK,KAAK,EACV,KAAK,eAAe,EACpB,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,GACtB,MAAM,6BAA6B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qin-ui/element-plus-pro",
-  "version": "1.4.2",
+  "version": "1.4.4",
   "description": "基于 element-plus 的二次封装组件",
   "bin": {
     "element-plus-pro": "./bin/init-ai.mjs"
@@ -40,7 +40,7 @@
   },
   "dependencies": {
     "vue-component-type-helpers": "^3.2.5",
-    "@qin-ui/pro-components-core": "^2.1.1"
+    "@qin-ui/pro-components-core": "^2.2.0"
   },
   "devDependencies": {
     "@types/node": "^24",

package/src/components/component-provider/components/index.vue

@@ -36,8 +36,8 @@ import {
   ensureInjectConfig,
 } from '../constants';
 import type { ComponentVars } from '../types';
-import { computed, provide } from 'vue';
-import { getObject, omit } from '../../../shared/core';
+import { computed, inject, provide, toValue } from 'vue';
+import { getObject, mergeComponentVars, omit } from '../../../shared/core';
 import type { ComponentName } from '../../form/constants';
 import { LOCALE_INJECT_KEY, type ProLocale } from '../../../locale';
 
@@ -74,20 +74,22 @@ const props = withDefaults(defineProps<Props>(), {
 });
 
 /*
- * 遍历 componentVars 的每个 key，获取或创建对应的 inject 配置
- * 将用户提供的值合并到默认值上，剔除该注入项的不可注入键后通过 provide 响应式注入到子组件树
+ * 遍历 componentVars 的每个 key，读取祖先注入值与本层配置合并后向下 provide
+ * 合并顺序为内置默认值 → 祖先注入值 → 本层 componentVars，剔除该注入项的不可注入键
  * 子组件通过 inject(config.injectionKey) 获取合并后的计算属性配置
  */
 (Object.keys(INJECT_CONFIG) as Array<keyof typeof INJECT_CONFIG>).forEach(
   key => {
     const config = INJECT_CONFIG[key];
     const ignored = config.ignoreProps;
+    const parentConfig = inject(config.injectionKey as any, undefined);
     provide(
       config.injectionKey as any,
       computed(() =>
         omit(
           {
             ...config.default,
+            ...(toValue(parentConfig) || {}),
             ...getObject(props.componentVars?.[key as keyof ComponentVars]),
           },
           ignored ?? []
@@ -102,10 +104,11 @@ if (props.componentVars) {
   Object.keys(props.componentVars).forEach(key => {
     if (!(key in INJECT_CONFIG)) {
       const config = ensureInjectConfig(key);
+      const parentConfig = inject(config.injectionKey as any, undefined);
       provide(
         config.injectionKey as any,
         computed(() => ({
-          ...config.default,
+          ...(toValue(parentConfig) || {}),
           ...getObject((props.componentVars as any)?.[key]),
         }))
       );
@@ -113,22 +116,36 @@ if (props.componentVars) {
   });
 }
 
+const parentComponentVars = inject(INJECT_COMPONENT_VARS, undefined);
 // 全量 componentVars：自定义组件键在运行期新增后同样可被子组件读取
 provide(
   INJECT_COMPONENT_VARS,
-  computed(() => (props.componentVars as Record<string, any>) ?? {})
+  computed(() =>
+    mergeComponentVars(
+      toValue(parentComponentVars),
+      props.componentVars as Record<string, any>
+    )
+  )
 );
 
+const parentComponents = inject(INJECT_COMPONENTS, undefined);
 // 注入自定义组件映射，BaseField 在解析组件时会优先使用此映射
 provide(
   INJECT_COMPONENTS,
-  computed(() => props.componentMap)
+  computed(() => ({
+    ...(toValue(parentComponents) || {}),
+    ...(props.componentMap ?? {}),
+  }))
 );
 
+const parentLocale = inject(LOCALE_INJECT_KEY, undefined);
 // 注入内置文案覆盖，useLocale 在解析文案时会优先使用
 provide(
   LOCALE_INJECT_KEY,
-  computed(() => props.locale)
+  computed(() => ({
+    ...(toValue(parentLocale) || {}),
+    ...(props.locale ?? {}),
+  }))
 );
 </script>
 

package/src/components/form/components/BaseField/index.vue

@@ -40,6 +40,7 @@ import {
 import {
   cloneDeep,
   getObject,
+  omitBy,
   useReactiveAttrs,
 } from '../../../../shared/core';
 import { useDisabledContext } from '../../../../shared/ui';
@@ -81,20 +82,23 @@ const componentRef = ref<any>();
 const attrs: any = useReactiveAttrs();
 
 /**
- * 全局默认配置注入：key = 组件名 + type 修饰段，inject 须在 setup 同步期调用。
+ * 全局默认配置注入：按组件名与 type 修饰段分别解析注入通道，inject 须在 setup 同步期调用。
  * 组件名与 `type` 仅取 setup 期初始值——运行期变更不会切换 Provider 的默认值预设
  * （`date-picker.month` 等子类型预设需在初始渲染前确定）。
+ * `date-picker` 的 type 缺省时按 `date` 段解析子类型预设。
  */
 const typeVal = attrs.type;
-const injectConfigKey =
-  typeof props.component === 'string'
-    ? [props.component, typeVal].filter(Boolean).join('.')
-    : '';
-const componentInjectConfig = injectConfigKey
-  ? getInjectConfig(injectConfigKey)
+const baseConfigKey =
+  typeof props.component === 'string' ? props.component : '';
+const typeConfigKey =
+  typeVal || (baseConfigKey === 'date-picker' ? 'date' : '');
+const subtypeConfigKey =
+  baseConfigKey && typeConfigKey ? `${baseConfigKey}.${typeConfigKey}` : '';
+const baseInjectConfig = baseConfigKey
+  ? getInjectConfig(baseConfigKey)
   : undefined;
-const rawInjectComponentProps = componentInjectConfig
-  ? inject(componentInjectConfig.injectionKey, componentInjectConfig.default)
+const subtypeInjectConfig = subtypeConfigKey
+  ? getInjectConfig(subtypeConfigKey)
   : undefined;
 // 全量 componentVars：运行期新增的自定义组件键由此兜底读取
 const componentVars = inject(INJECT_COMPONENT_VARS, undefined);
@@ -149,9 +153,12 @@ const parentDisabled = useDisabledContext();
  * 属性分为三类：绑定属性（v-model）、组件属性（传递给组件）、插槽（动态渲染）
  */
 const groupedAttrs = computed(() => {
+  // 库内置默认（基础键 → 子类型键）之后再铺项目配置，项目配置始终覆盖库默认
   const currentInjectProps = {
-    ...(toValue(rawInjectComponentProps) || {}),
-    ...getObject(toValue(componentVars)?.[injectConfigKey]),
+    ...getObject(baseInjectConfig?.default),
+    ...getObject(subtypeInjectConfig?.default),
+    ...getObject(toValue(componentVars)?.[baseConfigKey]),
+    ...getObject(toValue(componentVars)?.[subtypeConfigKey]),
   };
   const initProps = getInitProps(
     {
@@ -169,7 +176,8 @@ const groupedAttrs = computed(() => {
   );
   const mergedProps = mergeProps(
     initProps,
-    attrs,
+    // 未赋值（undefined）的键不作为显式值下发，保留注入默认值与占位符兜底
+    omitBy(attrs, value => value === undefined),
     { class: attrs.componentClass, style: attrs.componentStyle },
     { disabled: effectiveDisabled },
     { modelProp: modelPropName }

package/src/components/form/components/BaseField/utils/index.ts

@@ -65,7 +65,8 @@ const getPlaceholderProps = (
 /**
  * 组件初始属性：以内置默认值为底，按下发组件名补默认占位符文案
  *
- * @description 组件名由 `component` 与 `type` 拼接（如 `input.password`）；`component` 非字符串时返回空记录。
+ * @description 占位符按 `component` 与 `type` 拼接的键查表（如 `input.password`），
+ * 该键无占位符映射时回落到基础组件名；`component` 非字符串时返回空记录。
  * @param {Field} field - 字段配置
  * @param {Record<string, any>} injectProps - Provider 下发的组件默认属性
  * @param {LocaleT} t - 取文案的翻译函数
@@ -78,8 +79,12 @@ export const getInitProps = (
 ): Record<string, any> => {
   const { component, type } = field as any;
   if (typeof component === 'string') {
-    const k = [component, type].filter(Boolean).join('.');
-    return { ...injectProps, ...getPlaceholderProps(k, injectProps, t) };
+    const subtypeKey = [component, type].filter(Boolean).join('.');
+    const key =
+      PLACEHOLDER_KEYS[subtypeKey] || RANGE_PLACEHOLDER_KEYS[subtypeKey]
+        ? subtypeKey
+        : component;
+    return { ...injectProps, ...getPlaceholderProps(key, injectProps, t) };
   }
   return {};
 };

package/src/components/form/components/BaseFormItem/index.vue

@@ -1,205 +1,174 @@
-<script lang="ts" setup>
+<script lang="ts">
 /**
- * 表单字段渲染引擎
+ * 单字段行渲染组件
  *
  * @component BaseFormItem
  *
- * 负责将字段配置数组渲染为实际的表单项，支持：
- * - 字段分组（嵌套 fields 递归渲染，嵌套字段 path 须为完整点分路径）
- * - 网格布局（grid 属性控制）
- * - FormItem 包装（label、rules、校验等）
- * - 组件绑定（通过 BaseField 渲染具体组件）
- * - 插槽透传（label、error 等 FormItem 插槽）
+ * 将单个字段配置渲染为栅格项、FormItem 与控件，支持：
+ * - 字段属性分流（grid / formItem / component / slots）
+ * - 嵌套字段递归渲染（交由 BaseFormItems）
+ * - FormItem / 控件实例登记
  *
- * ## 渲染流程
- *
- * 1. 遍历 fields 数组，过滤 hidden 字段
- * 2. 通过 useGroupFieldAttrs Hook 纯计算将 field 配置拆分为 gridItemProps / formItemProps / componentProps / slots
- * 3. 递归渲染 BaseFormItem（嵌套表单）或 BaseField（输入组件）
- * 4. 通过 ref 回调收集 FormItem 和 Component 实例，注入到 field 对象上
- *
- * @param {Fields} [fields] - 字段配置数组
+ * @param {Field} field - 字段配置
  * @param {boolean | GridProps} [grid] - 是否启用网格布局
- * @param {boolean} [disabled] - 是否禁用所有子字段
+ * @param {boolean} [disabled] - 上层下发的禁用状态
+ * @param {Function} [setFormItemRef] - FormItem 实例登记回调
+ * @param {Function} [setComponentRef] - 控件实例登记回调
  *
  * @internal
  */
 import {
-  getObject,
-  isObjectItem,
-  normalizePathKey,
-} from '../../../../shared/core';
-import type { GridProps } from '../../../../shared/ui';
-import {
-  FormItem,
-  Grid as ElGrid,
-  GridItem as ElGridItem,
-  useProviderDisabled,
-} from '../../../../shared/ui';
-import { computed, inject, toRaw, toValue } from 'vue';
-import type { Fields, Grid } from '../../types';
+  computed,
+  defineComponent,
+  h,
+  toValue,
+  watch,
+  type PropType,
+  type VNode,
+} from 'vue';
+import { normalizePathKey } from '../../../../shared/core';
+import { FormItem, GridItem as ElGridItem } from '../../../../shared/ui';
+import type { Field, Grid } from '../../types';
 import BaseField from '../BaseField/index.vue';
+import BaseFormItems from '../BaseFormItems/index.vue';
 import SlotComponent from '../SlotComponent/index.vue';
-import ContainerFragment from '../ContainerFragment/index.vue';
-import { useGroupFieldAttrs } from '../../hooks/useGroupFieldAttrs';
-import { INJECT_CONFIG } from '../../../component-provider/constants';
+import {
+  useGroupedField,
+  type GroupedField,
+} from '../../hooks/useGroupFieldAttrs';
 
-defineOptions({ name: 'BaseFormItem', inheritAttrs: false });
+export default defineComponent({
+  name: 'BaseFormItem',
+  inheritAttrs: false,
+  props: {
+    /** 字段配置 */
+    field: { type: Object as PropType<Field>, required: true },
+    /** 是否启用网格布局 */
+    grid: {
+      type: [Boolean, Object] as PropType<Grid>,
+      default: undefined,
+    },
+    /** 上层下发的禁用状态 */
+    disabled: { type: Boolean, default: undefined },
+    /** FormItem 实例登记回调 */
+    setFormItemRef: {
+      type: Function as PropType<
+        (field: Field, el: any, getFormItemProps: () => any) => void
+      >,
+      default: undefined,
+    },
+    /** 控件实例登记回调 */
+    setComponentRef: {
+      type: Function as PropType<(field: Field, el: any) => void>,
+      default: undefined,
+    },
+  },
+  setup(props) {
+    const grouped = useGroupedField(() => props.field);
+    const enableGrid = computed(() => !!props.grid);
 
-type Props = {
-  grid?: Grid;
-  fields?: Fields;
-  disabled?: boolean;
-};
-const props = withDefaults(defineProps<Props>(), {
-  grid: undefined,
-  fields: () => [],
-  disabled: undefined,
-});
+    // 控件级配置身份：字符串组件名 + type 段；组件对象无 Provider 配置，使用固定值
+    const componentKey = computed(() => {
+      const field = props.field as any;
+      const component = toValue(field.component);
+      if (typeof component !== 'string') return 'component-object';
+      return `string:${component}:${toValue(field.type) ?? ''}`;
+    });
+    const effectiveDisabled = computed(
+      () => toValue(props.field.disabled) ?? props.disabled
+    );
 
-// 分组字段的禁用状态向下注入，供 BaseField 经禁用上下文消费
-useProviderDisabled(computed(() => props.disabled));
+    const setItemRef = (el: any) => {
+      props.setFormItemRef?.(
+        props.field,
+        el,
+        () => grouped.value.formItemProps
+      );
+    };
 
-const validFields = computed(() =>
-  // hidden 支持 Ref / ComputedRef 响应式形态（统一使用 toValue 取值）
-  (props.fields ?? []).filter(
-    field => isObjectItem(field) && !toValue((field as any).hidden)
-  )
-);
+    const setFieldRef = (el: any) => {
+      props.setComponentRef?.(props.field, el);
+    };
 
-const config = INJECT_CONFIG['pro-form'];
-const injectFormConfig = inject(config.injectionKey, config.default);
-const injectGrid = computed(() => toValue(injectFormConfig)?.grid);
+    // 字段对象变化后，实例访问器归属当前字段
+    watch(
+      () => props.field,
+      (next, prev) => {
+        if (!prev || prev === next) return;
+        props.setFormItemRef?.(prev, null, () => grouped.value.formItemProps);
+        props.setComponentRef?.(prev, null);
+      },
+      { flush: 'pre' }
+    );
 
-const enableGrid = computed(() => !!props.grid);
+    /** 按容器组件逐层包裹当前节点 */
+    const withContainer = (
+      node: VNode,
+      component: any,
+      containerProps: Record<string, any>
+    ): VNode =>
+      component ? h(component, containerProps, { default: () => node }) : node;
 
-const computedGridProps = computed<GridProps>(() => {
-  return enableGrid.value
-    ? { ...getObject(injectGrid.value), ...getObject(props.grid) }
-    : {};
-});
+    /** 组装 FormItem 的动态插槽与默认插槽 */
+    const renderFormItemSlots = (groupedField: GroupedField) => {
+      const slots: Record<string, any> = {};
+      Object.entries(groupedField.formItemSlots).forEach(([name, slot]) => {
+        slots[name] = (scope?: Record<string, any>) =>
+          h(SlotComponent as any, {
+            path: groupedField.path,
+            component: slot,
+            ...(scope || {}),
+          });
+      });
 
-/**
- * 以字段原始对象为 key 登记 FormItem / 控件实例，供 getFormItemRef / getComponentRef 读取；
- * 字段对象被回收后对应条目不再可读。
- */
-const formItemInstanceMap = new WeakMap<object, any>();
-const componentInstanceMap = new WeakMap<object, any>();
+      slots.default = () => {
+        const field = props.field as any;
+        if (field.fields) {
+          return h(BaseFormItems as any, {
+            grid: field.grid ?? props.grid,
+            fields: field.fields,
+            disabled: effectiveDisabled.value,
+          });
+        }
+        return h(BaseField as any, {
+          key: componentKey.value,
+          ref: setFieldRef,
+          ...groupedField.componentProps,
+          path: groupedField.path,
+          disabled: effectiveDisabled.value,
+        });
+      };
+      return slots;
+    };
 
-/** 已告警过的字段对象（不可写场景去重） */
-const warnedFrozenFields = new WeakSet<object>();
-const defineFieldAccessors = (
-  raw: object,
-  accessors: Record<string, () => any>
-) => {
-  try {
-    for (const [key, getter] of Object.entries(accessors)) {
-      // 访问器仅用于字段对象读取，不参与属性遍历与字段配置透传
-      Object.defineProperty(raw, key, {
-        value: getter,
-        enumerable: false,
-        configurable: true,
-        writable: true,
+    return () => {
+      const groupedField = grouped.value;
+      let node: VNode = h(
+        FormItem as any,
+        {
+          ...groupedField.formItemProps,
+          ref: setItemRef,
+          prop: normalizePathKey(groupedField.path),
+          path: groupedField.path,
+        },
+        renderFormItemSlots(groupedField)
+      );
+      node = withContainer(node, groupedField.container, {
+        path: groupedField.path,
       });
-    }
-  } catch {
-    if (!warnedFrozenFields.has(raw)) {
-      warnedFrozenFields.add(raw);
-      console.warn(
-        '[pro-components] 字段配置对象不可写（如被 Object.freeze），getFormItemRef / getComponentRef 等实例访问器挂载失败。'
+      node = withContainer(
+        node,
+        enableGrid.value ? ElGridItem : undefined,
+        groupedField.gridItemProps
       );
-    }
-  }
-};
-
-const setFormItemRef = (field: any, el: any, formItemProps?: any) => {
-  if (!field || typeof field !== 'object') return;
-  const raw = toRaw(field);
-  if (el) {
-    formItemInstanceMap.set(raw, el);
-    defineFieldAccessors(raw, {
-      getFormItemRef: () => formItemInstanceMap.get(raw),
-      getFormItemComputedProps: () => formItemProps,
-    });
-  } else {
-    formItemInstanceMap.delete(raw);
-    delete raw.getFormItemRef;
-    delete raw.getFormItemComputedProps;
-  }
-};
-
-const setComponentRef = (field: any, el: any) => {
-  if (!field || typeof field !== 'object') return;
-  const raw = toRaw(field);
-  if (el) {
-    componentInstanceMap.set(raw, el);
-    defineFieldAccessors(raw, {
-      getComponentRef: () => componentInstanceMap.get(raw)?.getComponentRef(),
-      getComponentComputedProps: () =>
-        componentInstanceMap.get(raw)?.getComponentComputedProps(),
-    });
-  } else {
-    componentInstanceMap.delete(raw);
-    delete raw.getComponentRef;
-    delete raw.getComponentComputedProps;
-  }
-};
-
-const groupedFields = useGroupFieldAttrs(validFields);
+      return node;
+    };
+  },
+});
 </script>
 
-<template>
-  <ContainerFragment
-    :component="enableGrid ? ElGrid : undefined"
-    v-bind="computedGridProps"
-    style="width: 100%"
-  >
-    <template v-for="item of groupedFields" :key="item.renderKey">
-      <ContainerFragment
-        :component="enableGrid ? ElGridItem : undefined"
-        v-bind="item.gridItemProps"
-      >
-        <ContainerFragment :component="item.container" :path="item.path">
-          <FormItem
-            v-bind="item.formItemProps"
-            :ref="el => setFormItemRef(item.rawField, el, item.formItemProps)"
-            :prop="normalizePathKey(item.path)"
-            :path="item.path"
-          >
-            <template
-              v-for="(slot, name) in item.formItemSlots"
-              :key="name"
-              #[name]="scoped"
-            >
-              <SlotComponent
-                :path="item.path"
-                :component="slot"
-                v-bind="scoped"
-              />
-            </template>
-            <template v-if="item.rawField.fields">
-              <BaseFormItem
-                :grid="(item.rawField as any).grid ?? props.grid"
-                :fields="item.rawField.fields"
-                :disabled="toValue(item.rawField.disabled) ?? props.disabled"
-              />
-            </template>
-            <template v-else>
-              <BaseField
-                :ref="el => setComponentRef(item.rawField, el)"
-                v-bind="item.componentProps"
-                :path="item.path"
-                :disabled="toValue(item.rawField.disabled) ?? props.disabled"
-              />
-            </template>
-          </FormItem>
-        </ContainerFragment>
-      </ContainerFragment>
-    </template>
-  </ContainerFragment>
-</template>
-
 <style scoped lang="less">
+/* 分组字段的嵌套 FormItem 间距 */
 [class*='-form-item'] [class*='-form-item'] {
   margin-bottom: 18px;
 }