diff --git a/src/components/FormBuilder/FormItemsRenderer.js b/src/components/FormBuilder/FormItemsRenderer.js index da55da7..676491b 100644 --- a/src/components/FormBuilder/FormItemsRenderer.js +++ b/src/components/FormBuilder/FormItemsRenderer.js @@ -84,12 +84,8 @@ const FormItemsRenderer = ({ }; }; - // 获取传给formItem的属性 - const getFormItemProps = (option) => { - const formItemProps = typeof option.formItemProps === "function" - ? option.formItemProps(getFormValues()) - : (option.formItemProps || {}); - + // 设置日期组件的属性 + const setDateComponentProps = (option, formItemProps) => { // 为日期组件添加特殊处理 if ([ FORM_ITEM_RENDER_ENUM.DATE, @@ -117,6 +113,15 @@ const FormItemsRenderer = ({ formItemProps.getValueFromEvent = (_, dateString) => dateString; formItemProps.getValueProps = value => ({ value: Array.isArray(value) ? value.map(v => v ? dayjs(v) : undefined) : undefined }); } + }; + + // 获取传给 formItem 的属性 + const getFormItemProps = (option) => { + const formItemProps = typeof option.formItemProps === "function" + ? option.formItemProps(getFormValues()) + : (option.formItemProps || {}); + + setDateComponentProps(option, formItemProps); return formItemProps; }; @@ -218,6 +223,11 @@ const FormItemsRenderer = ({ return { span: itemSpan, labelCol: itemLabelCol, wrapperCol: itemWrapperCol }; }; + // 获取是否动态表单项 + const getIsDynamicFormItem = (option, formItemProps) => { + return (option.shouldUpdate ?? option.dependencies) || (formItemProps.shouldUpdate ?? formItemProps.dependencies); + }; + // 获取 hidden const getHidden = (hidden) => { // 支持动态计算 hidden @@ -420,6 +430,9 @@ const FormItemsRenderer = ({ delete formItemProps.dependencies; delete formItemProps.shouldUpdate; + if (getHidden(option.hidden)) + return null; + return ( {listOptions.map((listOption, listIndex) => { - if (getHidden(listOption.hidden)) - return null; - const col = getCol(listOption); const formItemProps = getFormItemProps(listOption); @@ -532,7 +542,7 @@ const FormItemsRenderer = ({ if (listOption.render === FORM_ITEM_RENDER_ENUM.FORM_LIST) return renderFormList(params); - if ((listOption.shouldUpdate ?? listOption.dependencies) || (formItemProps.shouldUpdate ?? formItemProps.dependencies)) + if (getIsDynamicFormItem(listOption, formItemProps)) return renderDynamicFormItem(params); // 判断一个项是否需要显示按钮(不是 onlyForLabel 且不是隐藏的) @@ -562,6 +572,7 @@ const FormItemsRenderer = ({ if (listIndex === lastShowIndex || isNextNestedFormList || isNextNoShow) { delete formItemProps.dependencies; delete formItemProps.shouldUpdate; + return ( {options.map((option, index) => { - if (getHidden(option.hidden)) - return null; - const col = getCol(option); const style = getStyle(index); const formItemProps = getFormItemProps(option); @@ -657,7 +665,7 @@ const FormItemsRenderer = ({ return renderFormList(params); // 如果配置了 shouldUpdate 或 dependencies,使用 Form.Item 的联动机制 - if ((option.shouldUpdate ?? option.dependencies) || (formItemProps.shouldUpdate ?? formItemProps.dependencies)) + if (getIsDynamicFormItem(option, formItemProps)) return renderDynamicFormItem(params); // 普通表单项(静态配置)