fix(form): 修复表单项隐藏逻辑错误
parent
3cef2a3014
commit
43b36f1e26
|
|
@ -84,12 +84,8 @@ const FormItemsRenderer = ({
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
// 获取传给formItem的属性
|
// 设置日期组件的属性
|
||||||
const getFormItemProps = (option) => {
|
const setDateComponentProps = (option, formItemProps) => {
|
||||||
const formItemProps = typeof option.formItemProps === "function"
|
|
||||||
? option.formItemProps(getFormValues())
|
|
||||||
: (option.formItemProps || {});
|
|
||||||
|
|
||||||
// 为日期组件添加特殊处理
|
// 为日期组件添加特殊处理
|
||||||
if ([
|
if ([
|
||||||
FORM_ITEM_RENDER_ENUM.DATE,
|
FORM_ITEM_RENDER_ENUM.DATE,
|
||||||
|
|
@ -117,6 +113,15 @@ const FormItemsRenderer = ({
|
||||||
formItemProps.getValueFromEvent = (_, dateString) => dateString;
|
formItemProps.getValueFromEvent = (_, dateString) => dateString;
|
||||||
formItemProps.getValueProps = value => ({ value: Array.isArray(value) ? value.map(v => v ? dayjs(v) : undefined) : undefined });
|
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;
|
return formItemProps;
|
||||||
};
|
};
|
||||||
|
|
@ -218,6 +223,11 @@ const FormItemsRenderer = ({
|
||||||
return { span: itemSpan, labelCol: itemLabelCol, wrapperCol: itemWrapperCol };
|
return { span: itemSpan, labelCol: itemLabelCol, wrapperCol: itemWrapperCol };
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// 获取是否动态表单项
|
||||||
|
const getIsDynamicFormItem = (option, formItemProps) => {
|
||||||
|
return (option.shouldUpdate ?? option.dependencies) || (formItemProps.shouldUpdate ?? formItemProps.dependencies);
|
||||||
|
};
|
||||||
|
|
||||||
// 获取 hidden
|
// 获取 hidden
|
||||||
const getHidden = (hidden) => {
|
const getHidden = (hidden) => {
|
||||||
// 支持动态计算 hidden
|
// 支持动态计算 hidden
|
||||||
|
|
@ -420,6 +430,9 @@ const FormItemsRenderer = ({
|
||||||
delete formItemProps.dependencies;
|
delete formItemProps.dependencies;
|
||||||
delete formItemProps.shouldUpdate;
|
delete formItemProps.shouldUpdate;
|
||||||
|
|
||||||
|
if (getHidden(option.hidden))
|
||||||
|
return null;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Col key={getKey(option) || index} span={col.span} style={style}>
|
<Col key={getKey(option) || index} span={col.span} style={style}>
|
||||||
<Form.Item
|
<Form.Item
|
||||||
|
|
@ -512,9 +525,6 @@ const FormItemsRenderer = ({
|
||||||
return (
|
return (
|
||||||
<Row gutter={gutter} key={field.key}>
|
<Row gutter={gutter} key={field.key}>
|
||||||
{listOptions.map((listOption, listIndex) => {
|
{listOptions.map((listOption, listIndex) => {
|
||||||
if (getHidden(listOption.hidden))
|
|
||||||
return null;
|
|
||||||
|
|
||||||
const col = getCol(listOption);
|
const col = getCol(listOption);
|
||||||
const formItemProps = getFormItemProps(listOption);
|
const formItemProps = getFormItemProps(listOption);
|
||||||
|
|
||||||
|
|
@ -532,7 +542,7 @@ const FormItemsRenderer = ({
|
||||||
if (listOption.render === FORM_ITEM_RENDER_ENUM.FORM_LIST)
|
if (listOption.render === FORM_ITEM_RENDER_ENUM.FORM_LIST)
|
||||||
return renderFormList(params);
|
return renderFormList(params);
|
||||||
|
|
||||||
if ((listOption.shouldUpdate ?? listOption.dependencies) || (formItemProps.shouldUpdate ?? formItemProps.dependencies))
|
if (getIsDynamicFormItem(listOption, formItemProps))
|
||||||
return renderDynamicFormItem(params);
|
return renderDynamicFormItem(params);
|
||||||
|
|
||||||
// 判断一个项是否需要显示按钮(不是 onlyForLabel 且不是隐藏的)
|
// 判断一个项是否需要显示按钮(不是 onlyForLabel 且不是隐藏的)
|
||||||
|
|
@ -562,6 +572,7 @@ const FormItemsRenderer = ({
|
||||||
if (listIndex === lastShowIndex || isNextNestedFormList || isNextNoShow) {
|
if (listIndex === lastShowIndex || isNextNestedFormList || isNextNoShow) {
|
||||||
delete formItemProps.dependencies;
|
delete formItemProps.dependencies;
|
||||||
delete formItemProps.shouldUpdate;
|
delete formItemProps.shouldUpdate;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Col key={getKey(listOption) || listIndex} span={col.span} style={style}>
|
<Col key={getKey(listOption) || listIndex} span={col.span} style={style}>
|
||||||
<Form.Item
|
<Form.Item
|
||||||
|
|
@ -632,9 +643,6 @@ const FormItemsRenderer = ({
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{options.map((option, index) => {
|
{options.map((option, index) => {
|
||||||
if (getHidden(option.hidden))
|
|
||||||
return null;
|
|
||||||
|
|
||||||
const col = getCol(option);
|
const col = getCol(option);
|
||||||
const style = getStyle(index);
|
const style = getStyle(index);
|
||||||
const formItemProps = getFormItemProps(option);
|
const formItemProps = getFormItemProps(option);
|
||||||
|
|
@ -657,7 +665,7 @@ const FormItemsRenderer = ({
|
||||||
return renderFormList(params);
|
return renderFormList(params);
|
||||||
|
|
||||||
// 如果配置了 shouldUpdate 或 dependencies,使用 Form.Item 的联动机制
|
// 如果配置了 shouldUpdate 或 dependencies,使用 Form.Item 的联动机制
|
||||||
if ((option.shouldUpdate ?? option.dependencies) || (formItemProps.shouldUpdate ?? formItemProps.dependencies))
|
if (getIsDynamicFormItem(option, formItemProps))
|
||||||
return renderDynamicFormItem(params);
|
return renderDynamicFormItem(params);
|
||||||
|
|
||||||
// 普通表单项(静态配置)
|
// 普通表单项(静态配置)
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue