fix(demo->customerForm): FormItem下有多个受控组件控制台显示错误提示的bug (#3238)

* fix: FormItem下有多个受控组件控制台显示错误提示的bug

* chore(demo->customerForm): use Promise in rule validator

---------

Co-authored-by: invalid w <wangjuesix@gmail.com>
This commit is contained in:
open-carp 2023-11-04 11:28:25 +08:00 committed by GitHub
parent 509541d11e
commit ec646c57b8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 20 additions and 12 deletions

View File

@ -23,17 +23,17 @@
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index'; import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
import { CollapseContainer } from '/@/components/Container/index'; import { CollapseContainer } from '/@/components/Container/index';
import { useMessage } from '/@/hooks/web/useMessage'; import { useMessage } from '/@/hooks/web/useMessage';
import { Input, FormItem, Select } from 'ant-design-vue'; import { Input, FormItem, FormItemRest, Select } from 'ant-design-vue';
import { PageWrapper } from '/@/components/Page'; import { PageWrapper } from '/@/components/Page';
const custom_typeKey2typeValueRules = (model) => { const custom_typeKey2typeValueRules = (model) => {
return [ return [
{ {
required: true, required: true,
validator: (rule, value, callback) => { validator: async () => {
if (!model.typeKey) return callback('请选择类型'); if (!model.typeKey) return Promise.reject('请选择类型');
if (!model.typeValue) return callback('请输入数据'); if (!model.typeValue) return Promise.reject('请输入数据');
callback(); Promise.resolve();
}, },
}, },
]; ];
@ -145,7 +145,13 @@
<Select.Option value="测试名称">测试名称</Select.Option> <Select.Option value="测试名称">测试名称</Select.Option>
</Select> </Select>
<FormItem name="typeValue2" class="local_typeValue" rules={[{ required: true }]}> <FormItem name="typeValue2" class="local_typeValue" rules={[{ required: true }]}>
<Input placeholder="请输入" v-model:value={model['typeValue2']} disabled={disabled} /> <FormItemRest>
<Input
placeholder="请输入"
v-model:value={model['typeValue2']}
disabled={disabled}
/>
</FormItemRest>
</FormItem> </FormItem>
</Input.Group> </Input.Group>
); );
@ -183,12 +189,14 @@
<Select.Option value="公司名称">公司名称</Select.Option> <Select.Option value="公司名称">公司名称</Select.Option>
<Select.Option value="产品名称">产品名称</Select.Option> <Select.Option value="产品名称">产品名称</Select.Option>
</Select> </Select>
<Input <FormItemRest>
style="width: calc(100% - 120px); margin-left: -1px;" <Input
placeholder="请输入" style="width: calc(100% - 120px); margin-left: -1px;"
v-model:value={model['typeValue']} placeholder="请输入"
disabled={disabled} v-model:value={model['typeValue']}
/> disabled={disabled}
/>
</FormItemRest>
</Input.Group> </Input.Group>
</FormItem> </FormItem>
); );