ant design獲取表單中適用v-decorator修飾表單中的值

vue文件

<a-form>
    <a-form-item :labelCol="labelCol"
                         :wrapperCol="wrapperCol"
                 label="適用階段"
                 hasFeedback>
      <a-select v-decorator="['mealCategory', {}]"
                @blur="getMealCategory"
                :disabled="isDisabled"
                placeholder="請選擇適用階段">
        <a-select-option value="小學">小學</a-select-option>
        <a-select-option value="初中">初中</a-select-option>
        <a-select-option value="高中">高中</a-select-option>
      </a-select>
    </a-form-item>
</a-form>    

獲取動作

methods: {
    getMealCategory () {
      this.mealCategory = this.form.getFieldValue('mealCategory');
      console.log(`調用getMealCategory()--${this.mealCategory}`)
      //將獲取的學校類別傳遞給學校組件
      this.$refs.activityMealSchoolTable.addGradeAndSchool(this.mealCategory);
    }
}

詳解:

this.form.getFieldDecorator(id, options) 和 v-decorator="[id, options]" #
經過 getFieldDecorator或v-decorator 包裝的控件，表單控件會自動添加 value（或 valuePropName 指定的其他屬性） onChange（或 trigger 指定的其他屬性），數據同步將被 Form 接管，這會導致以下結果：

你不再需要也不應該用 onChange 來做同步，但還是可以繼續監聽 onChange 等事件。
你不能用控件的 value defaultValue 等屬性來設置表單域的值，默認值可以用 getFieldDecorator 或 v-decorator 里的 initialValue。
你不應該用 v-model，可以使用 this.form.setFieldsValue 來動態改變表單值。

注意：使用 getFieldsValue getFieldValue setFieldsValue 等時，應確保對應的 field 已經用 getFieldDecorator 或 v-decorator 注冊過了。


為什么blur事件獲取改變的值
    適用change時間獲取時具有延后性,暫時適用blur

站在巨人的肩膀上摘蘋果:

https://blog.csdn.net/weixin_44051815/article/details/88305722

https://www.wandouip.com/t5i363134/