element-UI里表单验证失效的问题

　　最近接手了一个项目，是同事做的，我在其中新增了几个模块，后来同事做其他项目去了，这个项目就完全落到我身上了，当然，bug也都落到我身上了。

　　好了，吐槽完毕开始说正事，有个bug就是修改密码时，二次密码校验失效的问题。我看代码里确实是写了表单校验，就是照着element官网上那样写的，拿到问题就开始测试，是否执行了校验函数，验证确实没有。然后百度了一些方法，有说prop和绑定的值不一样的，但是我检查了代码，绑定值确实是一致的。几经折腾发现是v-if导致的问题。

　　因为一个页面里有两个表单，所以通过v-if来控制显隐，正是这样，表单无法触发校验，改为v-show就可以了。

　　百度的时候看到说prop和v-modle绑定的值一定要一致，这个问题也是经常出现的，就顺便记录一下。

<el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
  <el-form-item label="密码" prop="pass">
    <el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
  </el-form-item>
  <el-form-item label="确认密码" prop="checkPass">
    <el-input type="password" v-model="ruleForm.checkPass" autocomplete="off"></el-input>
  </el-form-item>
  <el-form-item label="年龄" prop="age">
    <el-input v-model.number="ruleForm.age"></el-input>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
    <el-button @click="resetForm('ruleForm')">重置</el-button>
  </el-form-item>
</el-form>

　　总之严格按照例子上所写来，就不会错了。