ivew 传值的一个问题？！o_0?!

Question

<Select @on-change="setOption" 
:label-in-value="true" 
style='width: 150px' 
placeholder='省份' 
v-model="model12" 
filterable>

    <Option v-for="item in cityList" :value="item.value">{{ item.label }}</Option>

</Select>

cityList: [
        {
            id:'11',
            value: 'beijing',
            label: '北京'
        },
        {
            id:'31',
            value: 'shanghai',
            label: '上海'
        },
        {
            id:'13',
            value: 'hebei',
            label: '河北'
        },
    ],

setOption(v){
    console.log(v);
},

就是这么简单的代码，为甚么只能console.log出label和value。。。

请问怎么能获取到ID呢？

Answer 1

这不是写了只会传回 value 和 lable (开启 label-in-value) 吗。

你是想直接顺便把 id 传回来吗，那两种做法：

1. 手动提交表单的情况下，将 id 与 value 用某个分隔符拼接在一起，在 on-change 中手动拆开即可得到 id

2. 写个工具方法根据 lable 或 value 查找对应 id

   const id = this.cityList.filter(c => c.label === label && c.value === value)[0]
   if (!id) {
      console.error(`label: ${label}, value: ${value} 无对应 id!`) // 虽然应该是不可能发生这情况
   }