diff --git a/src/components/Form/src/components/FormItem.vue b/src/components/Form/src/components/FormItem.vue index f642254f..947bc210 100644 --- a/src/components/Form/src/components/FormItem.vue +++ b/src/components/Form/src/components/FormItem.vue @@ -25,11 +25,15 @@ function renderComponent() { // const Comp = componentMap.get(formItem.component) as ReturnType; const Comp = resolveComponent(formItem.component) as ReturnType; - return ( - - {childrenComponent()} - - ); + if (elComponentItem[formItem.component]) { + return ( + + {childrenComponent()} + + ); + } else { + return ; + } } function childrenComponent() { @@ -47,7 +51,7 @@ ); } else { - return null; + return; } } @@ -66,11 +70,11 @@ return () => { const { formItem } = props; - const { prop, render, rules, label, isSlot } = formItem; + const { prop, render, rules, label } = formItem; const values = { formModel: formModel, formItem: formItem }; const solfn = getSlot(slots, prop, values); const getContent = () => { - return isSlot ? solfn : render ? render(values) : renderComponent(); + return solfn ? solfn : render ? render(values) : renderComponent(); }; return ( diff --git a/src/components/Form/types/from.ts b/src/components/Form/types/from.ts index a6b7007e..6ea0bc9d 100644 --- a/src/components/Form/types/from.ts +++ b/src/components/Form/types/from.ts @@ -19,7 +19,6 @@ export interface FormItemProps { * @param(component) 组件名称,ElInput,ElSelect * @param(label) 标签名 * @param(prop) form表单双向绑定字段 - * @param(isSlot) 是否自定义内容 * @param(props) 组件属性 * @param(rules) 表单校验 * @param(childrenComponent) 子组件属性 类似ElSelect、ElCheckboxGroup、ElRadioGroup等组件 @@ -28,7 +27,6 @@ export interface FormItemListProps { component: string; label: string; prop: string; - isSlot?: boolean; props?: object; rules?: object | Array; childrenComponent?: { diff --git a/src/styles/index.scss b/src/styles/index.scss index f4ffcf48..a1c5888e 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -80,6 +80,7 @@ div:focus { ul { list-style-type: none; padding: 0; + margin: 0; } @for $i from 1 to 6 { diff --git a/src/views/components/form/index.vue b/src/views/components/form/index.vue index 864a32c6..f239dc6d 100644 --- a/src/views/components/form/index.vue +++ b/src/views/components/form/index.vue @@ -10,25 +10,6 @@ placeholder="自定义输入框" > - - @@ -331,13 +312,23 @@ { component: 'ElDatePicker', label: '时间选择器', - isSlot: true, prop: 'dateTime', + props: { + type: 'datetimerange', + rangeSeparator: 'To', + startPlaceholder: 'Start date', + endPlaceholder: 'End date', + }, }, { component: 'ElCascader', label: '多级选择器', - isSlot: true, + props: { + options: cascaderOptions, + onVisibleChange: (e: any) => { + console.log(e); + }, + }, prop: 'cascader', }, ], @@ -389,7 +380,6 @@ component: 'ElInput', label: 'slot组件', prop: 'slotInput', - isSlot: true, rules: [{ required: true, type: 'string' }], }, {