<el-form :model="registerUser" :rules="rules2" ref="registerForm" label-width="80px"
         class="registerForm">
    <el-form-item label="用户名" prop="username2">
        <el-input v-model="registerUser.username" placeholder="请输入用户名"></el-input>
    </el-form-item>
</el-form>
rules2: {
  username2: [
    {required: true, message: '请输入用户名', trigger: 'blur'},
    {min:2,max:20,message:'长度在2到20个字符之间',trigger:'blur'}
  ]
}

以上代码运行时 不论用户名输入什么都会提示“请输入用户名”,这是应为不论你输入什么根本就没有取到值,原因是prop参数设置不一致导致。prop的参数应该设置为model.key的值,不能随意取名,此处prop应为:prop="username"

<el-form :model="registerUser" :rules="rules2" ref="registerForm" label-width="80px"
         class="registerForm">
    <el-form-item label="用户名" prop="username">
        <el-input v-model="registerUser.username" placeholder="请输入用户名"></el-input>
    </el-form-item>
</el-form>
rules2: {
  username: [
    {required: true, message: '请输入用户名', trigger: 'blur'},
    {min:2,max:20,message:'长度在2到20个字符之间',trigger:'blur'}
  ]
}

如下图所示:

GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:2 个月前 )
c345bb45 6 个月前
a07f3a59 * Update transition.md * Update table.md * Update transition.md * Update table.md * Update transition.md * Update table.md * Update table.md * Update transition.md * Update popover.md 7 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐