Ant Design Vue2表单验证失效、select下拉框验证失效

简述

Ant Design Vue2表单验证失效、表单校验

三个下拉框，级联联动，动态赋值，第一项changge之后2，3需要=null或者=''，但是发现明明第二个select已经选择了而且this.form.b不是空为啥还是校验不通过

前情提示

系统：

一说

• 部分截图、链接等因过期、更换域名、MD语法等可能不显示，可联系反馈（备注好博文地址），谢谢❤
• 带有#号、删除线、不操作、不执行字样的为提示或者备份bash，实际不执行
• 如果无法下载、无法复制，请评论后留言即可。收到消息后会第一时间回复～
• 知识付费，1对1技术支持
• www点pusdn点com

有账号的朋友，可以点个赞或者评论两句哦，评论后会获得积分奖励～

一般来说，正常使用，都是没有问题的，都可以校验通过，除非写错了

可能原因一：数据不是响应式

检查下第二个select的v-modal是否没有初始化定义。

data() {
    return {
        hjm: { a: null }
    };
},

Vue 组件中，hjm 对象的属性 a 是响应式的，但 hjm.b 并不是响应式的。在 Vue 中，只有在初始数据的时候存在的属性才会被 Vue 设置为响应式，后来动态添加的属性不会成为响应式。

所以，如果你之后想要 hjm.b 成为响应式的，你可以使用 Vue 的 this.$set 方法：

this.$set(this.hjm, 'b', null);

这将确保 hjm.b 成为响应式的属性。这是因为 this.$set 方法会告诉 Vue 在对象上设置一个新属性，并确保它是响应式的。

所以，如果你想让 hjm.b 是响应式的，可以在需要的地方使用 this.$set 来设置它。希望这解答了你的问题！如果有其他问题，随时问我。

《vue el-select校验失效问题解决》