mirror of
https://gitee.com/bootx/dax-pay-ui.git
synced 2025-09-03 02:47:30 +00:00
perf(component): 1.优化appendSchemaByField只能单一添加一个表单项的问题,可以传入数组表单项,统一添加,减少重复方法调用 2. 增加批量添加表单项demo (#2472)
This commit is contained in:
@@ -4,6 +4,7 @@
|
||||
<BasicForm @register="register" @submit="handleSubmit">
|
||||
<template #add="{ field }">
|
||||
<Button v-if="Number(field) === 0" @click="add">+</Button>
|
||||
<Button class="ml-2" v-if="Number(field) === 0" @click="add">批量添加表单配置</Button>
|
||||
<Button v-if="field > 0" @click="del(field)">-</Button>
|
||||
</template>
|
||||
</BasicForm>
|
||||
@@ -106,13 +107,51 @@
|
||||
);
|
||||
n.value++;
|
||||
}
|
||||
/**
|
||||
* @description: 批量添加
|
||||
*/
|
||||
function batchAdd() {
|
||||
appendSchemaByField(
|
||||
[
|
||||
{
|
||||
field: `field${n.value}a`,
|
||||
component: 'Input',
|
||||
label: '字段' + n.value,
|
||||
colProps: {
|
||||
span: 8,
|
||||
},
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
field: `field${n.value}b`,
|
||||
component: 'Input',
|
||||
label: '字段' + n.value,
|
||||
colProps: {
|
||||
span: 8,
|
||||
},
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
field: `${n.value}`,
|
||||
component: 'Input',
|
||||
label: ' ',
|
||||
colProps: {
|
||||
span: 8,
|
||||
},
|
||||
slot: 'add',
|
||||
},
|
||||
],
|
||||
'',
|
||||
);
|
||||
n.value++;
|
||||
}
|
||||
|
||||
function del(field) {
|
||||
removeSchemaByField([`field${field}a`, `field${field}b`, `${field}`]);
|
||||
n.value--;
|
||||
}
|
||||
|
||||
return { register, handleSubmit, add, del };
|
||||
return { register, handleSubmit, add, del, batchAdd };
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
Reference in New Issue
Block a user