⭐️⭐️⭐️ 自定义组件 表单验证 v-model 自动更新验证 trigger: 'change' 不触发，解决方案 加 <Input v-model="formData.abc" /> vue2 iview

⭐️⭐️⭐️ 自定义组件表单验证 v-model 自动更新验证 trigger: 'change' 不触发，解决方案 加 vue2 iview

ai方案2：手动引入 Emitter mixin（推荐）

// shUploadInForm.vue
import Emitter from 'iview/src/mixins/emitter'  // 或者从你的 iview 路径引入

export default {
  mixins: [Emitter],  // 引入后就有 dispatch 方法了
  computed: {
    ccValue: {
      get() {
        if (this.value === '') return []
        return this.value.split('|')
      },
      set(value) {
        const newVal = value.join('|')
        this.$emit('input', newVal)
        this.$emit('on-change', newVal)
        
        // 关键：向 FormItem 派发事件
        this.dispatch('FormItem', 'on-form-change', newVal)
      }
    }
  }
}

iview的Input就能联动触发表单校验

我就想，既然Input能触发，我就在放个Input就完了呗

触发

<Form ref="refForm" :model="formData" :rules="formRules" :label-width="160" label-colon>
          <FormItem prop="gdcl" label="归档材料">
            <shUploadInForm v-model="formData.gdcl" />
            <Input v-model="formData.gdcl" style="display: none" />
          </FormItem>
formRules: {
        gdcl: [{ required: true, message: '不能为空', trigger: 'change' }]
}
        </Form>