From 82bf0094c78f75dad59600ec0c8a44cf1cebcd08 Mon Sep 17 00:00:00 2001 From: Electrolux <59329360+electroluxcode@users.noreply.github.com> Date: 星期六, 20 四月 2024 16:56:05 +0800 Subject: [PATCH] fix(batch-add-formitem):fix the form not working when setFieldsValue through form-groups and add a demo with form groups (#3765) --- src/views/demo/form/AppendForm.vue | 77 +++++++++++++++++++++++++++++++++++++- src/components/Form/src/hooks/useFormEvents.ts | 2 2 files changed, 76 insertions(+), 3 deletions(-) diff --git a/src/components/Form/src/hooks/useFormEvents.ts b/src/components/Form/src/hooks/useFormEvents.ts index e9e6ff8..7d36459 100644 --- a/src/components/Form/src/hooks/useFormEvents.ts +++ b/src/components/Form/src/hooks/useFormEvents.ts @@ -163,7 +163,7 @@ } else { nestKeyArray.forEach((nestKey: string) => { try { - const value = nestKey.split('.').reduce((out, item) => out[item], values); + const value = get(values,nestKey) if (isDef(value)) { unref(formModel)[nestKey] = unref(value); validKeys.push(nestKey); diff --git a/src/views/demo/form/AppendForm.vue b/src/views/demo/form/AppendForm.vue index a7cd888..7c2b4c1 100644 --- a/src/views/demo/form/AppendForm.vue +++ b/src/views/demo/form/AppendForm.vue @@ -1,6 +1,6 @@ <template> <PageWrapper title="琛ㄥ崟澧炲垹绀轰緥"> - <CollapseContainer title="琛ㄥ崟澧炲垹"> + <CollapseContainer title="琛ㄥ崟椤瑰鍒�"> <BasicForm @register="register" @submit="handleSubmit"> <template #add="{ field }"> <a-button v-if="Number(field) === 0" @click="add">+</a-button> @@ -11,6 +11,15 @@ </template> </BasicForm> </CollapseContainer> + <CollapseContainer title="琛ㄥ崟缁勫鍒�" class="my-3"> + <a-button @click="setGroup">璁剧疆鍒濆鍊�</a-button> + <a-button class="m-2" @click="addGroup"> + 鎵归噺娣诲姞琛ㄥ崟 + </a-button> + <a-button @click="delGroup">鎵归噺鍑忓皯琛ㄥ崟</a-button> + <BasicForm @register="registerGroup" @submit="handleSubmitGroup"> + </BasicForm> + </CollapseContainer> </PageWrapper> </template> <script lang="ts" setup> @@ -18,7 +27,10 @@ import { BasicForm, useForm } from '@/components/Form'; import { CollapseContainer } from '@/components/Container'; import { PageWrapper } from '@/components/Page'; - + + import { useMessage } from '@/hooks/web/useMessage'; + const { createMessage } = useMessage(); + const count = ref(0); const [register, { appendSchemaByField, removeSchemaByField, validate }] = useForm({ schemas: [ { @@ -48,6 +60,7 @@ async function handleSubmit() { try { const data = await validate(); + createMessage.success("璇峰墠寰�鎺у埗鍙版煡鐪嬭緭鍑�") console.log(data); } catch (e) { console.log(e); @@ -121,4 +134,64 @@ removeSchemaByField([`field${field}a`, `field${field}b`, `${field}`]); n.value--; } + const [ + registerGroup, + { appendSchemaByField: appendSchemaByFieldGroup, removeSchemaByField:removeSchemaByFieldGroup, getFieldsValue:getFieldsValueGroup,setFieldsValue }, + ] = useForm({ + schemas: [ + { + field: `field[${count.value}].a`, + component: 'Input', + label: '瀛楁a', + colProps:{span:9}, + + }, + { + field: `field[${count.value}].b`, + colProps:{span:9}, + component: 'Input', + label: '瀛楁b', + }, + + ], + labelWidth: 100, + actionColOptions: { span: 24 }, + baseColProps: { span: 8 }, + }); + + function addGroup() { + count.value++; + appendSchemaByFieldGroup([ { + field: `field[${count.value}].a`, + component: 'Input', + colProps:{span:9}, + label: '瀛楁a', + }, + { + field: `field[${count.value}].b`, + component: 'Input', + colProps:{span:9}, + label: '瀛楁b', + }, + ],"") + } + + function delGroup() { + removeSchemaByFieldGroup([`field[${count.value}].a`, `field[${count.value}].b`]); + count.value--; + } + + function setGroup(){ + setFieldsValue({ + field:[{ + a:"榛樿a", + b:"榛樿b" + }] + }) + } + + function handleSubmitGroup(){ + createMessage.success("璇峰墠寰�鎺у埗鍙版煡鐪嬭緭鍑�") + console.log(getFieldsValueGroup()) + } </script> -- Gitblit v1.8.0