版权声明:本文为博主原创文章,转载请注明作者和出处,如有错误,望不吝赐教。 https://blog.csdn.net/weixin_41888813/article/details/82466558
:disabled="true"
form中包含的数据才会进行验证,如果from中的字段加了类似disabled控制,不会报错,但是验证会很奇特的无法通过。
因此,需要验证的字段,必须放入form中,同时不能限制。
<div class="row">
<div class="col-sm-6">
<el-form-item label="登录账号">
<el-input v-model="form.account" :disabled="true"></el-input>
</el-form-item>
</div>
</div>
<script>
export default {
data() {
var validateAccount = (rule, value, callback) => {
//......
};
return {
form: {
account: ''
},
rules: {
account: [
{required: true, message: '请输入用户账号', trigger: 'change'},
{min: 2, max: 20, message: '长度在 2 到20个字符', trigger: 'change'},
{validator: validateAccount, trigger: 'blur'}
]
}
}
},
mounted() {
this.initData();
},
methods: {
submitEvent() {
this.$refs.form.validate(valid => {
debugger;
if (valid) { //由于上面的account设置了disable,出现异象
//通过验证,提交表单......
}
},
initData() {
//编辑时初始化数据
}
}
}
</script>