两个from表单不同的对象,提交的时候表单验证直接成功了,下面时代码
onSubmit() {
const form1Valid = this.$refs.registration.validate()
const form2Valid = this.$refs.customer.validate()
if (form1Valid && form2Valid) {
axios.post("/api/admin/registration/save", this.registration)
.then((response) => {
this.$message({
message: response.data,
type: 'success'
});
}).catch((err) => {
console.log(err)
})
axios.post("/api/admin/customer/update", this.customer)
.then((response) => {
console.log(response.data)
this.list()
}).catch((err) => {
console.log(err)
})
} else {
this.$message({
message: '请认真填写',
type: 'success'
});
}
},
list() {
this.$router.replace('/registrationList')
},
async onSubmit() {
const form1Valid =await this.$refs.registration.validate()
const form2Valid =await this.$refs.customer.validate()
前三行找我这个改一下, 你那个是异步操作,所以不会等校验结果直接就执行后面的代码了 你可以打印输出一下
form1Valid,form2Valid 无论怎么 填写都 是true吗? 你打印一下 。在 不符合rules 规则时 试试
方法用错了,validate()返回的是一个对象,不是bool,你可以这样写const form1Valid = this.$refs.registration.validate((valid, fields)=>valid),valid才是校验值
不必自己写css,用的时element里面自带的,但是我这个方法只是实现一级目录
https://blog.csdn.net/JunVei/article/details/128465384 可以看看这篇博客