el-input表单校验默认失败
时间: 2023-10-07 17:14:28 浏览: 101
Vue element-ui父组件控制子组件的表单校验操作
el-input表单校验默认情况下是没有校验失败的提示的,需要手动设置错误提示信息。可以通过设置`rules`属性来实现表单校验,同时在`rules`属性中设置`message`属性来设置错误提示信息。例如:
```html
<template>
<el-input v-model="inputValue" :rules="rules"></el-input>
</template>
<script>
export default {
data() {
return {
inputValue: '',
rules: [
{
required: true,
message: '请输入内容',
trigger: 'blur'
}
]
}
}
}
</script>
```
在上面的示例中,设置了一个`required`校验规则,当用户未输入内容时,会触发校验失败,并提示`'请输入内容'`的错误信息。`trigger`属性表示校验的触发方式,这里设置为`blur`表示在输入框失去焦点时触发校验。
阅读全文