解决Element中表单校验规则不生效问题（vue项目）_动态校验没有触发blur element

解决Element中表单校验规则不生效问题（vue项目）

    <el-form-item label="name">
      <el-input v-model="ruleForm.name" />
    </el-form-item>
1
2
3

const rules = reactive({
  name: [
    { required: true, message: 'Please input name', trigger: 'blur' },
    { min: 3, max: 5, message: 'Length should be 3 to 5', trigger: 'blur' },
  ],
})
1
2
3
4
5
6

最近做一个vue项目，发现表单校验规则没生效，竟然没有校验就能提交，仔细检查发现粗心大意，没有给el-form-item加prop属性。

    <el-form-item label="name" prop="name">
      <el-input v-model="ruleForm.name" />
    </el-form-item>
1
2
3

加上prop属性就生效啦！