el-form表单校验只能输入中文
时间: 2023-07-28 15:30:32 浏览: 156
表单验证只能输入数字中文源码
4星 · 用户满意度95%
el-form 表单的校验可以通过在表单元素中设置 `rules` 属性来实现,其中 `rules` 属性可以设置多个校验规则,包括必填、长度、格式等。如果你希望某个表单元素只能输入中文,可以在 `rules` 中设置一个正则表达式来限制输入。
下面是一个示例代码,用于限制一个 el-input 元素只能输入中文:
```html
<el-form ref="form" :model="formData" :rules="rules">
<el-form-item label="姓名" prop="name">
<el-input v-model="formData.name"></el-input>
</el-form-item>
</el-form>
```
```javascript
data() {
return {
formData: {
name: ''
},
rules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' },
{ pattern: /^[\u4e00-\u9fa5]+$/, message: '请输入中文姓名', trigger: 'blur' }
]
}
}
}
```
在上面的代码中,我们在 `rules` 中为 `name` 字段设置了两个校验规则,第一个规则为必填,第二个规则为正则表达式,只允许输入中文字符。当输入的内容不符合规则时,表单会提示相应的错误信息。
阅读全文