注意属性的绑定
el-from标签中绑定model属性和rules属性。
-
model:保存值得对象
-
规则对象
<el-form
label-width="60px"
class="form_count"
:model="acount"
:rules="rules"
ref="formRef"
>
<el-form-item label="账号" prop="name">
<el-input type="text" v-model="acount.name"></el-input>
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input type="password" v-model="acount.password"></el-input>
</el-form-item>
</el-form>
//属性对象
const acount = reactive({
name: "",
password: ""
});
//为每个属性编写规则
const rules = {
name: [
{
required: true,
message: "账号是必传的哦~",
trigger: "blur"
},
{
pattern: /^[a-z0-9]{5,10}$/,
message: "用户名必须是5~10个字母或者数字~",
trigger: "blur"
}
],
password: [
{
required: true,
message: "密码是必传的哦~",
trigger: "blur"
},
{
pattern: /^[a-z0-9]{5,}$/,
message: "密码长度不能少于5位哦~",
trigger: "blur"
}
]
};