fix: 修复Form组件设置了hidden还是会出现占位空白

This commit is contained in:
kailong321200875 2024-01-10 10:21:36 +08:00
parent eafb5075d5
commit 0f531fd1d0
3 changed files with 28 additions and 22 deletions

View File

@ -230,7 +230,7 @@ export default defineComponent({
const { schema = [], isCol } = unref(getProps)
return schema
.filter((v) => !v.remove)
.filter((v) => !v.remove && !v.hidden)
.map((item) => {
// Divider
const isDivider = item.component === 'Divider'

View File

@ -79,7 +79,6 @@ const filterSearchSchema = (crudSchema: CrudSchema[]): FormSchema[] => {
for (let i = 0; i < length; i++) {
const schemaItem = crudSchema[i]
// 判断是否隐藏
if (!schemaItem?.search?.remove) {
const searchSchemaItem = {
component: schemaItem?.search?.component || 'Input',
...schemaItem.search,
@ -89,7 +88,6 @@ const filterSearchSchema = (crudSchema: CrudSchema[]): FormSchema[] => {
searchSchema.push(searchSchemaItem)
}
}
return searchSchema
}
@ -123,8 +121,6 @@ const filterFormSchema = (crudSchema: CrudSchema[]): FormSchema[] => {
for (let i = 0; i < length; i++) {
const formItem = crudSchema[i]
// 判断是否隐藏
if (!formItem?.form?.remove) {
const formSchemaItem = {
component: formItem?.form?.component || 'Input',
...formItem.form,
@ -134,7 +130,6 @@ const filterFormSchema = (crudSchema: CrudSchema[]): FormSchema[] => {
formSchema.push(formSchemaItem)
}
}
return formSchema
}

View File

@ -126,6 +126,8 @@ const schema = reactive<FormSchema[]>([
field: 'field3',
label: t('formDemo.radio'),
component: 'RadioGroup',
hidden: true,
value: '1',
componentProps: {
options: [
{
@ -143,7 +145,8 @@ const schema = reactive<FormSchema[]>([
field: 'field4',
label: t('formDemo.checkbox'),
component: 'CheckboxGroup',
value: [],
value: ['1'],
remove: true,
componentProps: {
options: [
{
@ -229,7 +232,8 @@ const {
setSchema,
getComponentExpose,
getFormItemExpose,
getElFormExpose
getElFormExpose,
getFormData
} = formMethods
const changeLabelWidth = (width: number | string) => {
@ -300,6 +304,8 @@ const setValue = async (reset: boolean) => {
}
]
})
const formData = await getFormData()
console.log(formData)
}
}
@ -396,6 +402,11 @@ const inoutValidation = async () => {
const formValidate = (prop: FormItemProp, isValid: boolean, message: string) => {
console.log(prop, isValid, message)
}
setTimeout(async () => {
const formData = await getFormData()
console.log(formData)
}, 2000)
</script>
<template>