diff --git a/components/FormBuilder/FormItemsRenderer.d.ts b/components/FormBuilder/FormItemsRenderer.d.ts index ebe0826..f9d79ed 100644 --- a/components/FormBuilder/FormItemsRenderer.d.ts +++ b/components/FormBuilder/FormItemsRenderer.d.ts @@ -41,6 +41,8 @@ export type FormValues = Record; * 表单配置项 */ export interface FormOption { + /** React 需要的 key,如果传递了唯一的 name,则不需要 */ + key?: string; /** 表单项字段名 */ name?: string | string[]; /** 表单项标签 */ diff --git a/components/FormBuilder/FormItemsRenderer.js b/components/FormBuilder/FormItemsRenderer.js index bffed2e..05c2782 100644 --- a/components/FormBuilder/FormItemsRenderer.js +++ b/components/FormBuilder/FormItemsRenderer.js @@ -133,6 +133,11 @@ const FormItemsRenderer = ({ return option.rules ? (Array.isArray(option.rules) ? option.rules : [option.rules]) : []; }; + // 获取key + const getKey = (option) => { + return option.key || option.name + } + // 渲染表单控件 const renderFormControl = (option) => { const componentProps = getComponentProps(option); @@ -278,7 +283,7 @@ const FormItemsRenderer = ({ // 如果是分割线 if (option.render === FORM_ITEM_RENDER_ENUM.DIVIDER) { return ( - + {option.label} ); @@ -291,7 +296,7 @@ const FormItemsRenderer = ({ ? (renderFormControl(option)) : ( + + { option.customizeRender ? (renderFormControl(option))