vue roleForm的rules不起作用/部分起作用【限制表单中输入的长度】【普通表单变验证表单】_vue.js中一个输入框有多个rules时仅生效第一个这个问题怎么处理

今天用vue+elementUI做前端，要用到验证表单，我由于已经写了表单信息，所以在普通表单的基础上去做修改。但是发现验证表单的id输入两条验证要求【非空和输入长度】，只有第一条起作用，并且没有随着输入的改变而改变。经过一番查找发现以下几点需要修改的地方：

1. 绑定：
   包括两部分：整个表格的绑定以及属性的绑定：
   整个表格使用【:model】绑定表格内容，使用【:rules】绑定规则，不可以使用v-model！！
   属性绑定使用【prop】
   举例：

 <el-form :model="form" :rules="rules" style="text-align: left" ref="dataForm">
        <el-form-item label="用户ID" :label-width="formLabelWidth" prop="userid">
          <el-input v-model="form.userid" autocomplete="off" ></el-input>
        </el-form-item>
1
2
3
4

上例中，在form标签中绑定了model和rule，这两个名字随便起，在属性item中绑定了prop，名字同样随便起。
需要注意，form的model、item中prop与input的v-model要对应！！

2. 在data中写rules
   这个可以参照elementUI官网的form验证表单进行
   注意data中要写两部分：form属性定义以及rules定义