vue select 获取value和lable

vue select控件在选择时需要把id和name两个值都获取到，实现方案如下：

select控件代码

 <FormItem label="物资类型：" prop="supplyType">
        <Select v-model="detailData.supplyType" :label-in-value="true" placeholder="请选择物资类型" @on-change="getVendorId">
              <Option v-for="item in supplyTypeList"
                            :value="item.id"
                            :key="item.id"
                            :lable="item.dictionaryName">{{ item.dictionaryName }}
               </Option>
        </Select>
 </FormItem>

change事件

getVendorId: function (val) {
       let that = this;
       that.detailData.supplyType=val.value;//获取label
       that.detailData.supplyTypeName=val.label;//获取value
},

下拉组件绑定数据源

    supplyTypeList[
     {
        "id": 45,
        "dictionaryName": "办公用品",
        "dictionaryCode": "nofficeSupplies"
      }
    ]