front_library
/
zy-react-library
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化FormItemsRenderer

master
LiuJiaNan 2025-12-12 15:46:29 +08:00
parent 2d78ef4323
commit e1135db10b
2 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/FormBuilder/FormItemsRenderer.d.ts vendored
View File

@ -71,8 +71,8 @@ export interface FormOption {
label?: ReactNode; label?: ReactNode;
/** 渲染类型 */ /** 渲染类型 */
render?: FormItemRenderType; render?: FormItemRenderType;
/** 占据栅格列数，默认 12 */ /** 占据栅格列数，默认 12，支持函数动态计算 */
span?: number | string; span?: number | string | ((formValues: FormValues) => number | string);
/** 是否必填，默认 true，支持函数动态计算 */ /** 是否必填，默认 true，支持函数动态计算 */
required?: boolean | ((formValues: FormValues) => boolean); required?: boolean | ((formValues: FormValues) => boolean);
/** 验证规则 */ /** 验证规则 */

10
components/FormBuilder/FormItemsRenderer.js
View File

@ -206,9 +206,17 @@ const FormItemsRenderer = ({
return collapse && index >= 3 ? { display: "none" } : undefined; return collapse && index >= 3 ? { display: "none" } : undefined;
}; };
// 获取 span
const getSpan = (span) => {
// 支持动态计算 span
return typeof span === "function"
? span(getFormValues())
: span;
}
// 列数 // 列数
const getCol = (option) => { const getCol = (option) => {
const itemSpan = option.render === FORM_ITEM_RENDER_ENUM.DIVIDER ? 24 : option.span ?? span; const itemSpan = option.render === FORM_ITEM_RENDER_ENUM.DIVIDER ? 24 : (getSpan(option.span) ?? span);
const itemLabelCol = option.labelCol ?? (itemSpan === 24 ? { span: labelCol.span / 2 } : labelCol); const itemLabelCol = option.labelCol ?? (itemSpan === 24 ? { span: labelCol.span / 2 } : labelCol);
const itemWrapperCol = option.wrapperCol ?? { span: 24 - itemLabelCol.span }; const itemWrapperCol = option.wrapperCol ?? { span: 24 - itemLabelCol.span };
return { span: itemSpan, labelCol: itemLabelCol, wrapperCol: itemWrapperCol }; return { span: itemSpan, labelCol: itemLabelCol, wrapperCol: itemWrapperCol };