@qin-ui/antd-vue-pro 2.5.2 → 2.5.3

package/es/index.js

@@ -1,7 +1,7 @@
 import "./antd-vue-pro.css";
-import { defineComponent, createBlock, renderSlot, openBlock, resolveDynamicComponent, normalizeProps, mergeProps, withCtx, createElementBlock, Fragment, createTextVNode, toDisplayString, inject, computed, toValue, ref, createCommentVNode, createSlots, renderList, createVNode, toRaw, resolveComponent, unref, provide, useSlots, shallowRef, onUpdated, triggerRef, createElementVNode, withModifiers, normalizeStyle, nextTick, mergeModels, useModel, watch, getCurrentInstance, onMounted, normalizeClass, guardReactiveProps } from "vue";
-import { Transfer, TreeSelect, Slider, Switch, RadioGroup, CheckboxGroup, TimePicker, RangePicker, DatePicker, Cascader, Select, InputNumber, InputPassword, InputSearch, Textarea, Input, Row, Col, FormItem, Form, Space, Button, theme, Dropdown, Menu, MenuItem, Checkbox, MenuDivider, Table } from "ant-design-vue";
-import { useForm as useForm$1, resolveLocaleName, zhTW, enUS, zhCN, format, useReactiveAttrs, cloneDeep, getObject, InjectionFormSlotsKey, isPlainObject, resolveFieldIdentity, isObjectItem, toPath, createFormProxy, InjectionFormKey, omitBy, camelizeProperties, useFields as useFields$1, useFormRef as useFormRef$1, useSearchFormExpand, pick, isPromise, useTable as useTable$1, omit } from "@qin-ui/pro-components-core";
+import { defineComponent, createBlock, renderSlot, openBlock, resolveDynamicComponent, normalizeProps, mergeProps, withCtx, createElementBlock, Fragment, createTextVNode, toDisplayString, inject, computed, toValue, ref, onBeforeUnmount, createCommentVNode, createSlots, renderList, createVNode, watch, h, toRaw, unref, provide, useSlots, shallowRef, onUpdated, triggerRef, createElementVNode, withModifiers, normalizeStyle, nextTick, mergeModels, useModel, getCurrentInstance, onMounted, normalizeClass, guardReactiveProps } from "vue";
+import { Transfer, TreeSelect, Slider, Switch, RadioGroup, CheckboxGroup, TimePicker, RangePicker, DatePicker, Cascader, Select, InputNumber, InputPassword, InputSearch, Textarea, Input, FormItem, Col, Row, Form, Space, Button, theme, Dropdown, Menu, MenuItem, Checkbox, MenuDivider, Table } from "ant-design-vue";
+import { useForm as useForm$1, resolveLocaleName, zhTW, enUS, zhCN, format, useReactiveAttrs, cloneDeep, getObject, InjectionFormSlotsKey, isPlainObject, resolveFieldIdentity, toPath, isObjectItem, InjectionFormKey, createFormProxy, omitBy, camelizeProperties, useFields as useFields$1, useFormRef as useFormRef$1, useSearchFormExpand, pick, isPromise, useTable as useTable$1, omit } from "@qin-ui/pro-components-core";
 import { enUS as enUS2, useFormData, zhCN as zhCN2, zhTW as zhTW2 } from "@qin-ui/pro-components-core";
 import { useConfigContextInject } from "ant-design-vue/es/config-provider/context";
 import { useInjectFormItemContext, useProvideFormItemContext } from "ant-design-vue/es/form/FormItemContext";
@@ -154,7 +154,7 @@ const ensureInjectConfig = (key) => {
   DYNAMIC_INJECT_CONFIG[key] = created;
   return created;
 };
-const _sfc_main$e = /* @__PURE__ */ defineComponent({
+const _sfc_main$f = /* @__PURE__ */ defineComponent({
   ...{ name: "ContainerFragment", inheritAttrs: false },
   __name: "index",
   props: {
@@ -172,7 +172,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$d = /* @__PURE__ */ defineComponent({
+const _sfc_main$e = /* @__PURE__ */ defineComponent({
   ...{ name: "SlotComponent", inheritAttrs: false },
   __name: "index",
   props: {
@@ -265,7 +265,7 @@ const useLocale = () => {
   };
   return { t, lang };
 };
-const _sfc_main$c = /* @__PURE__ */ defineComponent({
+const _sfc_main$d = /* @__PURE__ */ defineComponent({
   ...{ name: "BaseField", inheritAttrs: false },
   __name: "index",
   props: {
@@ -278,6 +278,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
       // 原始值直接传递，引用值克隆快照
       typeof val === "object" && val !== null ? cloneDeep(val) : val
     );
+    const isSameValue = (a, b) => a === b || a !== a && b !== b;
     const props = __props;
     const { t } = useLocale();
     const form = useForm(false);
@@ -291,9 +292,21 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
       },
       clearValidate: formItemContext.clearValidate
     });
+    let pendingChange = false;
+    let pendingChangeValue;
     const triggerFormItemChange = (value2) => {
-      emit("field-value-change", value2);
+      pendingChangeValue = value2;
+      if (pendingChange) return;
+      pendingChange = true;
+      queueMicrotask(() => {
+        if (!pendingChange) return;
+        pendingChange = false;
+        emit("field-value-change", pendingChangeValue);
+      });
     };
+    onBeforeUnmount(() => {
+      pendingChange = false;
+    });
     const attrs = useReactiveAttrs();
     const pickerVal = attrs.picker;
     const injectConfigKey = typeof props.component === "string" ? [props.component, pickerVal].filter(Boolean).join(".") : "";
@@ -315,12 +328,17 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
         let newVal = val;
         const { valueFormatter } = groupedAttrs.value;
         const setFormatter = typeof valueFormatter === "function" ? valueFormatter : typeof valueFormatter === "object" && typeof (valueFormatter == null ? void 0 : valueFormatter.set) === "function" ? valueFormatter.set : void 0;
+        const oldVal = (_a = form.getFormData) == null ? void 0 : _a.call(form, props.path);
         if (setFormatter) {
-          const oldVal = setFormatter.length > 1 ? cloneDeepIfObject((_a = form.getFormData) == null ? void 0 : _a.call(form, props.path)) : void 0;
-          newVal = setFormatter(val, oldVal);
+          newVal = setFormatter(
+            val,
+            setFormatter.length > 1 ? cloneDeepIfObject(oldVal) : void 0
+          );
+        }
+        if (!isSameValue(newVal, oldVal)) {
+          (_b = form.setFormData) == null ? void 0 : _b.call(form, props.path, newVal);
+          triggerFormItemChange(newVal);
         }
-        (_b = form.setFormData) == null ? void 0 : _b.call(form, props.path, newVal);
-        triggerFormItemChange(newVal);
         const { onUpdateValue } = groupedAttrs.value;
         if (typeof onUpdateValue === "function") {
           onUpdateValue(val);
@@ -378,7 +396,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
       getComponentComputedProps: () => groupedAttrs.value.attrs
     });
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$e, {
+      return openBlock(), createBlock(_sfc_main$f, {
         component: groupedAttrs.value.componentContainer,
         path: props.path
       }, {
@@ -394,7 +412,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
               return {
                 name,
                 fn: withCtx((scoped) => [
-                  createVNode(_sfc_main$d, mergeProps({
+                  createVNode(_sfc_main$e, mergeProps({
                     path: props.path
                   }, scoped, { component: slot }), null, 16, ["path", "component"])
                 ])
@@ -407,8 +425,206 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const formItemPropKeys = Object.keys(formItemProps()).concat([
+  "formItemContainer"
+]);
+const gridItemPropKeys = Object.keys(colProps());
+const gridItemPropKeySet = new Set(gridItemPropKeys);
+const formItemPropKeySet = new Set(formItemPropKeys);
+const formItemSlotKeySet = new Set(FORM_ITEM_SLOT_KEYS);
+const groupField = (field, rawInject) => {
+  let gridItemProps2 = {};
+  let formItemProps2 = {};
+  const componentProps = { slots: {} };
+  const formItemSlots = {};
+  if (isPlainObject(field)) {
+    const { path: _path, name: _name, fields, formItemClass, formItemStyle, hidden, span, getFormItemRef, getComponentRef, getFormItemComputedProps, getComponentComputedProps, slots = {}, formItemDataAttrs = {}, componentDataAttrs = {}, extraProps, formItemContainer, ...rest } = field;
+    const { class: injectClassName, style: injectStyle, span: injectSpan, xs, sm, md, lg, xl, xxl, formItemContainer: injectFormItemContainer, ...injectRest } = rawInject;
+    const initGridItemProps = span || span === 0 ? { span } : { xs, sm, md, lg, xl, xxl, span: injectSpan };
+    gridItemProps2 = fields ? { ...initGridItemProps, span: span ?? 24 } : initGridItemProps;
+    const container = formItemContainer ?? injectFormItemContainer;
+    formItemProps2 = mergeProps(
+      injectRest,
+      { class: injectClassName, style: injectStyle },
+      { class: toValue(formItemClass), style: toValue(formItemStyle) },
+      formItemDataAttrs
+    );
+    Object.keys(rest).forEach((k) => {
+      if (gridItemPropKeySet.has(k)) {
+        gridItemProps2[k] = rest[k];
+      } else if (formItemPropKeySet.has(k)) {
+        formItemProps2[k] = rest[k];
+      } else {
+        componentProps[k] = rest[k];
+      }
+    });
+    Object.assign(componentProps, componentDataAttrs);
+    Object.keys(slots).forEach((k) => {
+      if (formItemSlotKeySet.has(k)) {
+        formItemSlots[k] = slots[k];
+      } else {
+        componentProps.slots[k] = slots[k];
+      }
+    });
+    if (formItemSlots.label && formItemProps2.label !== void 0) {
+      delete formItemProps2.label;
+    }
+    return {
+      path: resolveFieldIdentity(field),
+      gridItemProps: gridItemProps2,
+      formItemProps: formItemProps2,
+      formItemSlots,
+      componentProps,
+      formItemContainer: container,
+      rawField: field
+    };
+  }
+  return {
+    path: resolveFieldIdentity(field),
+    gridItemProps: gridItemProps2,
+    formItemProps: formItemProps2,
+    formItemSlots,
+    componentProps,
+    rawField: field
+  };
+};
+function useGroupedField(field) {
+  const config = INJECT_CONFIG["pro-form-item"];
+  const injectFormItemProps = inject(config.injectionKey, config.default);
+  return computed(
+    () => groupField(toValue(field), toValue(injectFormItemProps) || {})
+  );
+}
+const _sfc_main$c = defineComponent({
+  name: "BaseFormItem",
+  inheritAttrs: false,
+  props: {
+    /** 字段配置 */
+    field: { type: Object, required: true },
+    /** 是否启用网格布局 */
+    grid: {
+      type: [Boolean, Object],
+      default: void 0
+    },
+    /** 上层下发的禁用状态 */
+    disabled: { type: Boolean, default: void 0 },
+    /** FormItem 实例登记回调 */
+    setFormItemRef: {
+      type: Function,
+      default: void 0
+    },
+    /** 控件实例登记回调 */
+    setComponentRef: {
+      type: Function,
+      default: void 0
+    }
+  },
+  setup(props) {
+    const grouped = useGroupedField(() => props.field);
+    const enableGrid = computed(() => !!props.grid);
+    const componentKey = computed(() => {
+      const field = props.field;
+      const component = toValue(field.component);
+      if (typeof component !== "string") return "component-object";
+      return `string:${component}:${toValue(field.picker) ?? ""}`;
+    });
+    let formItemInstance;
+    const setItemRef = (el) => {
+      var _a;
+      formItemInstance = el;
+      (_a = props.setFormItemRef) == null ? void 0 : _a.call(
+        props,
+        props.field,
+        el,
+        () => grouped.value.formItemProps
+      );
+    };
+    const setFieldRef = (el) => {
+      var _a;
+      (_a = props.setComponentRef) == null ? void 0 : _a.call(props, props.field, el);
+    };
+    watch(
+      () => props.field,
+      (next, prev) => {
+        var _a, _b;
+        if (!prev || prev === next) return;
+        (_a = props.setFormItemRef) == null ? void 0 : _a.call(props, prev, null, () => grouped.value.formItemProps);
+        (_b = props.setComponentRef) == null ? void 0 : _b.call(props, prev, null);
+      },
+      { flush: "pre" }
+    );
+    const onFieldValueChange = () => {
+      var _a, _b;
+      if (((_a = grouped.value.formItemProps) == null ? void 0 : _a.autoLink) === false) return;
+      (_b = formItemInstance == null ? void 0 : formItemInstance.onFieldChange) == null ? void 0 : _b.call(formItemInstance);
+    };
+    const withContainer = (node, component, containerProps) => component ? h(component, containerProps, { default: () => node }) : node;
+    const renderFormItemSlots = (groupedField) => {
+      const slots = {};
+      Object.entries(groupedField.formItemSlots).forEach(([name, slot]) => {
+        slots[name] = (scope) => h(_sfc_main$e, {
+          path: groupedField.path,
+          component: slot,
+          ...scope || {}
+        });
+      });
+      slots.default = () => {
+        const field = props.field;
+        if (field.fields) {
+          return h(_sfc_main$b, {
+            grid: field.grid ?? props.grid,
+            fields: field.fields,
+            disabled: toValue(field.disabled)
+          });
+        }
+        return h(_sfc_main$d, {
+          key: componentKey.value,
+          ref: setFieldRef,
+          ...groupedField.componentProps,
+          path: groupedField.path,
+          onFieldValueChange
+        });
+      };
+      return slots;
+    };
+    return () => {
+      const groupedField = grouped.value;
+      let node = h(
+        FormItem,
+        {
+          ...groupedField.formItemProps,
+          ref: setItemRef,
+          name: toPath(groupedField.path),
+          path: groupedField.path
+        },
+        renderFormItemSlots(groupedField)
+      );
+      node = withContainer(node, groupedField.formItemContainer, {
+        path: groupedField.path
+      });
+      node = withContainer(
+        node,
+        enableGrid.value ? Col : void 0,
+        groupedField.gridItemProps
+      );
+      return node;
+    };
+  }
+});
 const fieldKeyMap = /* @__PURE__ */ new WeakMap();
 let fieldKeySeed = 0;
+const rowKeyMap = /* @__PURE__ */ new WeakMap();
+let rowKeySeed = 0;
+const getRowKey = (row) => {
+  const raw = toRaw(row);
+  let key = rowKeyMap.get(raw);
+  if (key === void 0) {
+    key = ++rowKeySeed;
+    rowKeyMap.set(raw, key);
+  }
+  return key;
+};
+const isIndexSegment = (segment) => /^(?:0|[1-9]\d*)$/.test(segment);
 const getFieldKey = (field) => {
   if (field === null || typeof field !== "object")
     return `raw_${String(field)}`;
@@ -420,82 +636,35 @@ const getFieldKey = (field) => {
   }
   return key;
 };
-const formItemPropKeys = Object.keys(formItemProps()).concat([
-  "formItemContainer"
-]);
-const gridItemPropKeys = Object.keys(colProps());
-const gridItemPropKeySet = new Set(gridItemPropKeys);
-const formItemPropKeySet = new Set(formItemPropKeys);
-const formItemSlotKeySet = new Set(FORM_ITEM_SLOT_KEYS);
-function useGroupFieldAttrs(validFields) {
-  const config = INJECT_CONFIG["pro-form-item"];
-  const injectFormItemProps = inject(config.injectionKey, config.default);
-  return computed(() => {
-    const rawInject = toValue(injectFormItemProps) || {};
-    return validFields.value.map((field) => {
-      let gridItemProps2 = {};
-      let formItemProps2 = {};
-      const componentProps = { slots: {} };
-      const formItemSlots = {};
-      if (isPlainObject(field)) {
-        const { path: _path, name: _name, fields, formItemClass, formItemStyle, hidden, span, getFormItemRef, getComponentRef, getFormItemComputedProps, getComponentComputedProps, slots = {}, formItemDataAttrs = {}, componentDataAttrs = {}, extraProps, formItemContainer, ...rest } = field;
-        const { class: injectClassName, style: injectStyle, span: injectSpan, xs, sm, md, lg, xl, xxl, formItemContainer: injectFormItemContainer, ...injectRest } = rawInject;
-        const initGridItemProps = span || span === 0 ? { span } : { xs, sm, md, lg, xl, xxl, span: injectSpan };
-        gridItemProps2 = fields ? { ...initGridItemProps, span: span ?? 24 } : initGridItemProps;
-        const container = formItemContainer ?? injectFormItemContainer;
-        formItemProps2 = mergeProps(
-          injectRest,
-          { class: injectClassName, style: injectStyle },
-          { class: toValue(formItemClass), style: toValue(formItemStyle) },
-          formItemDataAttrs
-        );
-        Object.keys(rest).forEach((k) => {
-          if (gridItemPropKeySet.has(k)) {
-            gridItemProps2[k] = rest[k];
-          } else if (formItemPropKeySet.has(k)) {
-            formItemProps2[k] = rest[k];
-          } else {
-            componentProps[k] = rest[k];
-          }
-        });
-        Object.assign(componentProps, componentDataAttrs);
-        Object.keys(slots).forEach((k) => {
-          if (formItemSlotKeySet.has(k)) {
-            formItemSlots[k] = slots[k];
-          } else {
-            componentProps.slots[k] = slots[k];
-          }
-        });
-        if (formItemSlots.label && formItemProps2.label !== void 0) {
-          delete formItemProps2.label;
-        }
-        const raw2 = resolveFieldIdentity(field);
-        return {
-          path: raw2,
-          gridItemProps: gridItemProps2,
-          formItemProps: formItemProps2,
-          formItemSlots,
-          componentProps,
-          formItemContainer: container,
-          rawField: field,
-          renderKey: getFieldKey(field)
-        };
-      }
-      const raw = resolveFieldIdentity(field);
-      return {
-        path: raw,
-        gridItemProps: gridItemProps2,
-        formItemProps: formItemProps2,
-        formItemSlots,
-        componentProps,
-        rawField: field,
-        renderKey: getFieldKey(field)
-      };
-    });
-  });
-}
+const getFieldDataKey = (field, rawFormData) => {
+  const path = resolveFieldIdentity(field);
+  if (!path || rawFormData === null || rawFormData === void 0) {
+    return getFieldKey(field);
+  }
+  const segments = toPath(path);
+  let node = rawFormData;
+  const rowIds = [];
+  let lastRowIndex = -1;
+  for (let i = 0; i < segments.length; i++) {
+    if (Array.isArray(node)) {
+      const segment = segments[i];
+      if (!isIndexSegment(segment)) break;
+      const element = node[Number(segment)];
+      if (element === null || typeof element !== "object") break;
+      rowIds.push(getRowKey(toRaw(element)));
+      lastRowIndex = i;
+      node = element;
+      continue;
+    }
+    if (node === null || typeof node !== "object") break;
+    node = node[segments[i]];
+  }
+  if (lastRowIndex === -1) return getFieldKey(field);
+  const rest = segments.slice(lastRowIndex + 1).join(".");
+  return `data:${rowIds.join("/")}:${rest}`;
+};
 const _sfc_main$b = /* @__PURE__ */ defineComponent({
-  ...{ name: "BaseFormItem", inheritAttrs: false },
+  ...{ name: "BaseFormItems", inheritAttrs: false },
   __name: "index",
   props: {
     grid: { type: [Boolean, Object], default: void 0 },
@@ -512,6 +681,20 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         )
       )
     );
+    const injectedForm = inject(InjectionFormKey, void 0);
+    const renderedFields = computed(() => {
+      const rawFormData = (injectedForm == null ? void 0 : injectedForm.formData) ? toRaw(injectedForm.formData) : void 0;
+      const seen = /* @__PURE__ */ new Map();
+      return validFields.value.map((field) => {
+        const baseKey = getFieldDataKey(field, rawFormData);
+        const count = seen.get(baseKey) ?? 0;
+        seen.set(baseKey, count + 1);
+        return {
+          field,
+          key: count === 0 ? baseKey : `${String(baseKey)}#${count}`
+        };
+      });
+    });
     useProviderDisabled(computed(() => props.disabled));
     const config = INJECT_CONFIG["pro-form"];
     const injectFormConfig = inject(config.injectionKey, config.default);
@@ -545,20 +728,14 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         }
       }
     };
-    const onFieldValueChange = (item) => {
-      var _a, _b;
-      if (((_a = item.formItemProps) == null ? void 0 : _a.autoLink) === false) return;
-      const instance = formItemInstanceMap.get(toRaw(item.rawField));
-      (_b = instance == null ? void 0 : instance.onFieldChange) == null ? void 0 : _b.call(instance);
-    };
-    const setFormItemRef = (field, el, formItemProps2) => {
+    const setFormItemRef = (field, el, getFormItemProps) => {
       if (!field || typeof field !== "object") return;
       const raw = toRaw(field);
       if (el) {
         formItemInstanceMap.set(raw, el);
         defineFieldAccessors(raw, {
           getFormItemRef: () => formItemInstanceMap.get(raw),
-          getFormItemComputedProps: () => formItemProps2
+          getFormItemComputedProps: getFormItemProps
         });
       } else {
         formItemInstanceMap.delete(raw);
@@ -587,69 +764,31 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         delete raw.getComponentComputedProps;
       }
     };
-    const groupedFields = useGroupFieldAttrs(validFields);
     return (_ctx, _cache) => {
-      const _component_BaseFormItem = resolveComponent("BaseFormItem");
-      return openBlock(), createBlock(_sfc_main$e, mergeProps({
-        component: enableGrid.value ? unref(Row) : void 0
-      }, computedGridProps.value), {
+      return enableGrid.value ? (openBlock(), createBlock(unref(Row), normalizeProps(mergeProps({ key: 0 }, computedGridProps.value)), {
         default: withCtx(() => [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(groupedFields), (item) => {
-            return openBlock(), createBlock(_sfc_main$e, mergeProps({
-              key: item.renderKey,
-              component: enableGrid.value ? unref(Col) : void 0
-            }, { ref_for: true }, item.gridItemProps), {
-              default: withCtx(() => [
-                createVNode(_sfc_main$e, {
-                  component: item.formItemContainer,
-                  path: item.path
-                }, {
-                  default: withCtx(() => [
-                    createVNode(unref(FormItem), mergeProps({ ref_for: true }, item.formItemProps, {
-                      ref_for: true,
-                      ref: (el) => setFormItemRef(item.rawField, el, item.formItemProps),
-                      name: unref(toPath)(item.path),
-                      path: item.path
-                    }), createSlots({
-                      default: withCtx(() => [
-                        item.rawField.fields ? (openBlock(), createBlock(_component_BaseFormItem, {
-                          key: 0,
-                          grid: item.rawField.grid ?? props.grid,
-                          fields: item.rawField.fields,
-                          disabled: toValue(item.rawField.disabled)
-                        }, null, 8, ["grid", "fields", "disabled"])) : (openBlock(), createBlock(_sfc_main$c, mergeProps({
-                          key: 1,
-                          ref_for: true,
-                          ref: (el) => setComponentRef(item.rawField, el)
-                        }, { ref_for: true }, item.componentProps, {
-                          path: item.path,
-                          onFieldValueChange: ($event) => onFieldValueChange(item)
-                        }), null, 16, ["path", "onFieldValueChange"]))
-                      ]),
-                      _: 2
-                    }, [
-                      renderList(item.formItemSlots, (slot, name) => {
-                        return {
-                          name,
-                          fn: withCtx((scoped) => [
-                            createVNode(_sfc_main$d, mergeProps({
-                              path: item.path,
-                              component: slot
-                            }, { ref_for: true }, scoped), null, 16, ["path", "component"])
-                          ])
-                        };
-                      })
-                    ]), 1040, ["name", "path"])
-                  ]),
-                  _: 2
-                }, 1032, ["component", "path"])
-              ]),
-              _: 2
-            }, 1040, ["component"]);
+          (openBlock(true), createElementBlock(Fragment, null, renderList(renderedFields.value, (item) => {
+            return openBlock(), createBlock(_sfc_main$c, {
+              key: item.key,
+              field: item.field,
+              grid: props.grid,
+              disabled: props.disabled,
+              "set-form-item-ref": setFormItemRef,
+              "set-component-ref": setComponentRef
+            }, null, 8, ["field", "grid", "disabled"]);
           }), 128))
         ]),
         _: 1
-      }, 16, ["component"]);
+      }, 16)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(renderedFields.value, (item) => {
+        return openBlock(), createBlock(_sfc_main$c, {
+          key: item.key,
+          field: item.field,
+          grid: props.grid,
+          disabled: props.disabled,
+          "set-form-item-ref": setFormItemRef,
+          "set-component-ref": setComponentRef
+        }, null, 8, ["field", "grid", "disabled"]);
+      }), 128));
     };
   }
 });
@@ -1488,7 +1627,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
         class: normalizeClass(["pro-table", unref(attrs).class]),
         style: normalizeStyle(unref(attrs).style)
       }, [
-        searchFormVisible.value || _ctx.$slots["search-form"] ? (openBlock(), createBlock(_sfc_main$e, {
+        searchFormVisible.value || _ctx.$slots["search-form"] ? (openBlock(), createBlock(_sfc_main$f, {
           key: 0,
           component: computedSearchFormConfig.value.container
         }, {
@@ -1511,7 +1650,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
           }),
           _: 3
         }, 8, ["component"])) : createCommentVNode("", true),
-        createVNode(_sfc_main$e, { component: computedTableContainer.value }, {
+        createVNode(_sfc_main$f, { component: computedTableContainer.value }, {
           default: withCtx(() => [
             createElementVNode("div", _hoisted_1, [
               _ctx.$slots["button-bar"] ? (openBlock(), createElementBlock("div", _hoisted_2, [
@@ -1664,12 +1803,12 @@ const index = {
   }
 };
 export {
-  _sfc_main$e as ContainerFragment,
+  _sfc_main$f as ContainerFragment,
   LOCALE_INJECT_KEY,
   _sfc_main as ProComponentProvider,
   _sfc_main$a as ProForm,
   ProTable,
-  _sfc_main$d as SlotComponent,
+  _sfc_main$e as SlotComponent,
   index as default,
   enUS2 as enUS,
   useFields,