vue表单验证中 Invalid prop: type check failed for prop “model“. Expected Object, got String with value “l

4/19 

在写vue项目注册页面中rules规则的时候，反复验证prop和rules中值相同的情况下，运行一直产生报错

<template>
<div>
  <div id="register" class="box" >
    <h3>注册登录页面</h3>
    <el-form ref="ruleform" :rules="rules" model="loginForm" label-width="20%">
    <el-form-item label="用户名:" prop="username">
            <el-input v-model="loginForm.username" placeholder="请输入用户名"></el-input>
    </el-form-item>
    <el-form-item prop="password" label="密  码:">
            <el-input v-model="loginForm.password" type="password" placeholder="请输入密码"></el-input>
    </el-form-item>
    <el-form-item prop="password2" label="确认密码:">
            <el-input v-model="loginForm.password2" type="password" placeholder="请再次输入密码"></el-input>
    </el-form-item>
    </el-form>
    <el-button type="primary" round @click="submitForm('ruleform')" class="btn">注册</el-button>
    <router-link to="/">返回登录</router-link>
  </div>
</div>
</template>

rules规则：

        rules:{
            username:[ 
              { required: true, message:'用户名不能为空',trigger:'blur'},
              {min:3, max:10, message:'用户名长度需在3-10',trigger:'blur'}
            ],
            password:[
              { required: true, message:'密码不能为空',trigger:'blur'},
              {min:3, max:10, message:'密码长度需在3-10',trigger:'blur'}
            ],
            password2:[
              { required: true, message:'密码不能为空',trigger:'blur'},
              {min:3, max:10, message:'密码长度需在3-10',trigger:'blur'},
              { validator: validatePass, trigger: 'blur' }
            ]
        }

报错情况：

解决方法：

 <el-form ref="ruleform" :rules="rules" :model="loginForm" label-width="20%">

model 加上“ ：”即可解决