自定义的组件如何触发element ui的表单校验

碰到一个问题，如果用原生html封装组件会无法触发element ui的表单校验，需要点击提交按钮才能校验。
rules里的trigger: 'blur’已经不起效了。
研究了一下解决办法。
主要发现有两招：
1、在父组件里手动触发el-form里的validateField事件

<childComponent v-model="ruleForm.fatherValue" @input="validateField('fatherValue')"/>

validateField(type) {
   this.$refs.ruleForm.validateField(type);
}

但是如果每次都在父组件里手动触发有点太沙雕了。
有没有办法可以直接写在子组件里呢？
那么看一下方法二。

2、在子组件里触发表单校验

<input type="text" name="" id="" :value="currentValue" @blur="handleBlur" @input="valueChange">

// methods里这么写
handleBlur(val) {
    this.$emit('blur', val.target.value);
    this.dispatch('ElFormItem', 'el.form.blur', [this.currentValue]);
},

// dispatch在element-ui/src/mixins/emitter里，引进来使用，或直接写进methods里也可以
dispatch(componentName, eventName, params) {
 var parent = this.$parent || this.$root;
 var name = parent.$options.componentName;
 while (parent && (!name || name !== componentName)) {
     parent = parent.$parent;
     if (parent) {
     name = parent.$options.componentName;
   	}
  }
  if (parent) {
    parent.$emit.apply(parent, [eventName].concat(params));
	}
},

如果不是blur，是change，就这样写：

this.dispatch('ElFormItem', 'el.form.change', [this.currentValue]);