在vue中使用rules对表单字段进行验证
1. 写在 data 中验证
<el-form ref="rulesForm" :rules="formRules" :model="rulesForm" label-width="200px">
formRules: {
userName: [
{required: true,message: "请输入用户名称",trigger: "blur"}
]
}
2. 写在行内
<el-form-item label="用户名" prop="name" >
<el-input type="text" id="username" v-model="username"
:rules="[{ required: true, message: '请填写用户名' },//用于表当验证
{pattern:/^[1][3,4,5,6,7,8][0-9]{9}$/,message:'请输入正确的11位手机号'}]"
></el-input>
</el-form-item>