element Select 选择器多选时获取对应的code和name

2、element Select 选择器多选时获取对应的code和name

2.1、在页面中使用el-select，此处是多选。道理都一样

<el-select
                    @change="cityChooseData"
                    size="small"
                    v-model="cityLimitData"
                    multiple
                    placeholder="请选择城市，可多选">
                    <el-option
                      v-for="item in cityOptions"
                      :key="item.code"
                      :label="item.name"
                      :value="item.code">
                    </el-option>
                    </el-select>

这里使用时，在el-select绑定其change事件，触发cityChooseData方法
选项循环的数据是cityOptions

2.2、data里面定义需要的数据

// 城市选择
cityOptions: [
{
    name:'成都',
    code:'chengdu'
},
{
    name:'宜宾',
    code:'yibin'
}
],

2.3、methods定义对应的方法

 // 城市选择结果
    cityChooseData(val) {
      // val是el-option里面的:value="item.code"这里绑定的对应的code的值
      let codeData = val
      // 由于是多选，所以这里是一个数组，里面存了多个val
      let codeDataLength = codeData.length
      // 定义一个空数组用于存储处理过后包含code和name的数据
      let obj = []
      // 第一层for循环遍历，拿到codeData数组里面的每一个val，就是对应的多选里面的每一个code
      for (let i = 0; i < codeDataLength; i++) {
        // 这里value就是对应的每一个code
        let value = codeData[i]
        // this.cityOptions就是你在el-option里面遍历的数组
        this.cityOptions.map((item) => {
          //  item就是this.cityOptions这个数组里面的每一个对象
          // 通过每一个对象的code与value也就是对应的每一个选中的code对比
          if (item.code === value) {
            // 符合的对象添加进之前定义的新新数组里面
            obj.push(item)
          }
        })
      }
      // 获得包含对应的code的数组，赋值用到对应的地方即可
      this.publishActivityData.citys = obj
    },