this.$refs.ruleForm.validate() }) }, 1500) 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 动态创建时校验 有时候需要动态创建一个输入框时,也需要检验,这时候就需要动态校验,不然一直卡着过不去 <el-row class="sc-row" :gutter="20" v-for="(t, i) in ruleForm.cont...
.validate() .then(res => { // 父表单验证成功后,验证子表单 return this.$refs[templateType].vaildate(); }) .then(res => { // 全部验证通过 // 获取整体数据 const reqData = { // 获取子组件数据 ...this.$refs[templateType].getData(), ...this.indexForm }; // 获取当前表单类型的...
}else{if(this.ruleForm.checkPass!=='') {this.$refs.ruleForm.validateField('checkPass'); }callback(); } } 再比如表单提交和重置官网再methods里面这样写的 methods: {submitForm(formName) {this.$refs[formName].validate((valid) =>{if(valid) {alert('submit!'); }else{console.log('error su...
使用过elementUI <el-form>的都知道,当我们需要表单校验时,vue2的写法是在点击事件里传ref绑定的名称,通过this.$refs[formName]获取dom元素,如下: <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button> submitForm(formName) { this.$refs[formName].validate((valid) = >{...
Vue单文件组件中多个同名的ref属性,this.$refs的取值及其使用注意事项 下面是绑定多个表单之后,需要每个都校验通过才能进行下一步。 原理同上。 Promise.all([editRef1.value,editRef2.value,editRef3.value].map(item=>item.validate())).then(asyncfunction(){...} ...
this.$refs.ruleForm.validate((valid) => { valid && typeof fn === 'function' && fn() }) }, submit() { if (!this.canSubmit) { return } this.checkForm(async () => { const { selectType } = this if (!this.canSubmit) { return } this.canSubmit = false const res = await ...
submitForm(formName) { this.$refs[formName].validate((valid) => { if (valid) { console.log(this.ruleForm) this.flag = true; setTimeout(()=>{ console.log("可再次提交!") this.flag= false; }, 2000) } else { console.log('error submit!!') return false } }) }, resetForm(form...
myRule: { username: [{required: true, message: '请输入账号', trigger: 'blur'}], password: [{required: true, message: '请输入密码', trigger: 'blur'}] }, checked: false } }, methods: { handleSubmit () { this.$refs.myForm.validate((valid) => { ...
preventDefault(); this.$refs.form.validate((valid) => { if (valid) { alert('提交成功'); } else { console.log('表单验证失败'); return false; } }); }, }, }; </script>表单校验表单组件通过rules属性进行表单校验配置。当表单提交时,会自动触发校验逻辑。
this.$refs["ruleForm"].validate(async (valid) => { if (valid) { await addIndexLibraryList(this.dataForm); this.$message.success("新增成功") this.$emit("close", close); } }); 3.el-cascader回显 watch:{ inspPlanEntity: { deep: true, ...