我正在执行表单验证,但是当我尝试通过动态验证时,它不起作用。
如何在不使用验证器方法的情况下进行动态验证,因为在表单中有很多字段,对于每个字段,我都需要动态验证,如果我将所有人使用验证器方法,那么我的代码将增加,而我不会不需要。
谁能建议我如何在消息中传递动态值?
var Main = {
data() {
return {
ruleForm2: {
email: "",
validationMsg: {
msg: "Please Enter Email"
}
},
rules2: {
email: [{
required: true,
message: "Please Enter Email",
trigger: 'blur'
}]
//email: [
// {
// required: true,
// message: this.validationMsg.msg,
// trigger: 'blur'
// }
//]
}
}
},
methods: {
submit() {
this.$refs['ruleForm2'].validate(valid => {
console.log("res", res);
if (valid) {
alert('true')
}
else {
alert('false')
return false
}
})
}
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
@import url("//unpkg.com/element-ui@1.4.1/lib/theme-default/index.css");
<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui@1.4.1/lib/index.js"></script>
<div id="app">
<template>
<el-form :model="ruleForm2" status-icon :rules="rules2" ref="ruleForm2" label-width="120px" class="demo-ruleForm">
<el-form-item label="Email" prop="email">
<el-input type="email" v-model="ruleForm2.email" autocomplete="off"></el-input>
</el-form-item>
<el-form-item>
<el-button @click="submit">Submit</el-button>
</el-form-item>
</el-form>
</template>
</div>