fix: 由于更新ant-vue 新版本到 4.0.2以上 tsx 渲染 FormItem 插入style 导致的出错 改换class (#3016)

This commit is contained in:
LanceJiang 2023-09-12 23:19:11 +08:00 committed by GitHub
parent 3ed49c3f8f
commit f4149c2f1d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,7 +1,7 @@
<template> <template>
<PageWrapper title="自定义组件示例"> <PageWrapper title="自定义组件示例">
<CollapseContainer title="自定义表单"> <CollapseContainer title="自定义表单">
<BasicForm @register="register" @submit="handleSubmit"> <BasicForm class="local_form" @register="register" @submit="handleSubmit">
<template #f3="{ model, field, disabled }"> <template #f3="{ model, field, disabled }">
<a-input v-model:value="model[field]" :disabled="disabled" placeholder="自定义slot" /> <a-input v-model:value="model[field]" :disabled="disabled" placeholder="自定义slot" />
</template> </template>
@ -144,11 +144,7 @@
<Select.Option value="测试类型">测试类型</Select.Option> <Select.Option value="测试类型">测试类型</Select.Option>
<Select.Option value="测试名称">测试名称</Select.Option> <Select.Option value="测试名称">测试名称</Select.Option>
</Select> </Select>
<FormItem <FormItem name="typeValue2" class="local_typeValue" rules={[{ required: true }]}>
name="typeValue2"
style="width: calc(100% - 120px); margin-left: -1px; border-right: 0; margin-bottom: 0;"
rules={[{ required: true }]}
>
<Input placeholder="请输入" v-model:value={model['typeValue2']} disabled={disabled} /> <Input placeholder="请输入" v-model:value={model['typeValue2']} disabled={disabled} />
</FormItem> </FormItem>
</Input.Group> </Input.Group>
@ -237,3 +233,15 @@
}, },
}); });
</script> </script>
<style lang="less" scoped>
:deep(.local_form) .local_typeValue {
width: calc(100% - 120px);
margin-bottom: 0;
margin-left: -1px;
border-right: 0;
.ant-input {
border-radius: 0 6px 6px 0;
}
}
</style>