VUE+Elment UI表單組件式渲染，必填驗證失敗

error message：

（輸入信息後，還是驗證失敗,並不是簡單錯誤【form-item對應prop寫錯類似】）

code:
form父組件

<el-form ref="card_form_ref" :model="card.values" :rules="card.rules" size="small">
       <el-form-item v-for="(field, i) in card.fields" :key="i" :prop="field.key"
            :label="field.name"
            label-width="120px">
            <!-- 渲染字段 begin -->
            <component :is="field.renderer" :option="field"
                :mode="'EDIT'" :ref="field.key" @on-result-change="onResultChange"/>
            <form-tips :tip="field.tip" v-if="field.tip"></form-tips>
            <!-- 渲染字段 end -->
        </el-form-item>
    </el-form>

code :子組件（渲染各個form字段）

<template>
    <div>
        <el-input   v-model="value" size="small"/>
    </div>
</template>

原因：代碼本身是沒什麼問題，這是elment ui watch回傳事件需要處理

解決：
子組件 code

<script>
import emitter from 'element-ui/src/mixins/emitter';   //引入這個組件【重點】
export default {
    mixins: [emitter],
    props: {
        mode: String,
        option: Object
    },
    data() {
        return {
            valid: true,
            value: this.option.value,
            
        };
    },
    mounted(){
    },
    methods: {
    },
    //監聽value的變化，然後會觸發一個change事件，
    //並且根據mixin中的emitter增加的dispatch來向父組件派發事件。【重點】
    watch: {    //作監聽處理
        value(news, old) {
            this.option.field.value = news
            this.$emit("on-result-change")  
            this.dispatch('ElFormItem', 'el.form.change', news);
        },

    },
    computed: {
    }
}
</script>

父組件 code

onResultChange(val){
        this.tabs.forEach((item,index)=>{
             if(item.fields){
                 item.fields.forEach((field,i)=>{
                     field.value = field.field.value
                     item.values[field.key] = field.field.value
                 })
             }
         })
     }
     //父組件的這個方法處理子組件的emit提交事件，刷新當前輸入值

參考資料：https://www.jianshu.com/p/6aeee09a3684