感觉 form表单的验证 v-decorator 写一大堆 非常的乱

[top-dante]

• I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

验证的条件多了，就会有一大堆的代码，非常的乱，提交审查的时候很容乱了，再次拉取的时候非常容易出现错误

What does the proposed API look like?

能不能想elementUI和iviewUI一样 在script里面写独立的验证规则

[tangjinzhou]

v-decorator 的验证规则也可以独立写在script里面啊

[top-dante]

v-decorator 的验证规则也可以独立写在script里面啊

求个demo 小白不太会

[airzhanglin]

我也觉得这个真的很头痛，写一大推，然后乱的很，看起来密密麻麻的一大片。楼主有解决办法吗

[sendya]

参考 https://codesandbox.io/s/yjnx1v0191?fontsize=14&module=%2Fsrc%2Fcomponents%2FHelloWorld.vue

[top-dante]

根据官方给出的demo 修改的简洁使用方法

<template>
    <a-card :bordered="false">
        <a-form :form="form" @submit="createProject">
            <a-form-item
                label="项目名称"
                :label-col="{ span: 5 }"
                :wrapper-col="{ span: 12 }"
                >
                <a-input name="subject" v-decorator="formRules.subject"/>
            </a-form-item>
            <a-form-item :wrapper-col="{ span: 12, offset: 5 }">
                <a-button type="primary" html-type="submit">Submit</a-button>
    </a-form-item>
        </a-form>
    </a-card>
</template>

<script>
    export default {
        name: "CreateProject",
        data() {
            return {
                form: this.$form.createForm(this),
                formRules: {
                    subject: ["subject", { rules: [{ required: true, message: "项目名称不能为空" }] }],
                }
            }
        },
        methods: {
            createProject(e){
                e.preventDefault();
                const {
                    form: { validateFields }
                } = this;
                validateFields((err, values) => {
                    if (!err) {
                    // eslint-disable-next-line no-console
                    console.log("Received values of form: ", values);
                    }
                });
            }
        },  
    }
</script>

<style scoped>

</style>

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.