elementui form表单中的ref
时间: 2024-06-13 12:07:12 浏览: 149
在ElementUI的表单Form中,ref属性用于获取表单对象,可以通过该属性获取到表单对象,从而进行表单验证等操作。具体使用方法如下:
1. 在el-form标签中添加ref属性,例如:`<el-form ref="form">`。
2. 在Vue实例中,通过this.$refs.form即可获取到表单对象,例如:
```javascript
export default {
data() {
return {
form: {
name: '',
age: ''
},
rules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' }
],
age: [
{ required: true, message: '请输入年龄', trigger: 'blur' }
]
}
}
},
methods: {
submitForm() {
this.$refs.form.validate(valid => {
if (valid) {
// 表单验证通过,提交表单
} else {
// 表单验证失败,提示错误信息
}
})
}
}
}
```
在上述代码中,通过this.$refs.form.validate()方法对表单进行验证,如果验证通过,则执行提交表单的操作,否则提示错误信息。
阅读全文