iview表单校验问题

在开发过程中，iview UI的表单校验，出现过以下情况，做个记录。

1 单个FormItem是否需要校验，用required属性判断，传布尔值；

<FormItem label="姓名：" prop="name" :required="required">
  <Input v-model="formValidate.name" placeholder="请输入姓名" />
</FormItem>

说明: required，布尔类型，通常是一个表达式，以此来判断是否需要校验该列；也可以是布尔值，但如果是直接传布尔值，一般会把校验规则直接写在Form的校验规则数组rules里面; 当然也可以用下面的第2种方法来动态判断是否需要校验。

2 动态校验某个属性是否需要校验，用rules属性，用计算属性来动态判断

<FormItem label="使用说明：" :rules="instructionsRules">
  <Input v-model="formValidate.instructions" type="textarea" :maxlength="2000" :autosize="{minRows: 2,maxRows: 5}" placeholder="请输入使用说明..."></Input>
</FormItem>

computed: {
    instructionsRules () {
      let goodsType = this.formValidate.goodsType * 1
      let _required = goodsType === 2 // 2表示卡券类型
      return { required: _required, message: '请输入使用说明', trigger: 'change' }
    }
}

instructionsRules是一个计算属性；比如添加商品页，商品类型有卡券和实物，卡券的使用说明是必填，实物非必填；

3 富文本动态判断输入字数是否超过最长的字符长度； 富文本组件的值变化后会把值传入父组件，父组件赋值后， 只需要把手动校验一下该FormItem，

this.$refs[this.formRefName].validateField('goodsDesc')
this.formRefName是表单Form中ref的名称；goodsDesc是FormItem中的prop属性

4 校验出现英文提示 如果没有设置校验规则，输入框失去焦点后，会出现 name(name是FormItem中prop的属性) is required; 此时可以用上面的第2种方法，动态校验。

5 编辑中各个参数都赋值了，校验时仍然提示，请输入值； 这个问题一般是数据类型的问题，一般需要转换成字符串，比如把数字类型转成字符串；

以上就是开发过程中碰到过的问题，欢迎大伙补充。