uniapp单独校验多个表单
时间: 2024-01-24 10:15:38 浏览: 155
iview同时验证多个表单问题总结
在uniapp中,可以使用`$refs`来获取表单组件的引用,并通过调用组件的`validate`方法来进行单独校验多个表单。下面是一个示例:
```html
<template>
<div>
<input ref="input1" v-model="form1" />
<input ref="input2" v-model="form2" />
<button @click="validateForms">校验表单</button>
</div>
</template>
<script>
export default {
data() {
return {
form1: '',
form2: ''
}
},
methods: {
validateForms() {
const input1Valid = this.$refs.input1.validate()
const input2Valid = this.$refs.input2.validate()
if (input1Valid && input2Valid) {
// 表单校验通过
console.log('表单校验通过')
} else {
// 表单校验不通过
console.log('表单校验不通过')
}
}
}
}
</script>
```
在上面的示例中,我们通过`$refs`获取了两个输入框的引用,然后在点击按钮时调用`validate`方法进行表单校验。如果所有表单都通过校验,则输出"表单校验通过",否则输出"表单校验不通过"。
阅读全文