el-input 校验只能输入中文和数字
时间: 2023-07-21 11:25:51 浏览: 173
vue input 输入校验字母数字组合且长度小于30的实现代码
您可以使用element-ui提供的el-input组件的自定义校验规则功能来实现只能输入中文和数字的校验,具体步骤如下:
1. 在el-input组件上添加自定义校验规则属性 :validator
```
<el-input v-model="inputValue" :validator="validateInput"></el-input>
```
2. 在methods中定义校验函数 validateInput,判断输入的内容是否符合要求
```
methods: {
validateInput(rule, value, callback) {
const reg = /^[\u4e00-\u9fa5\d]+$/ // 只能输入中文和数字
if (!value) {
callback(new Error('请输入内容'))
} else if (!reg.test(value)) {
callback(new Error('只能输入中文和数字'))
} else {
callback()
}
}
}
```
这样,用户在输入框中输入内容时,只有输入中文和数字才不会出现校验错误提示。
阅读全文