vue elementUI el-select 多选 同时获取label 和 value 的值【记录】

<el-form-item
   label="使用者IP地址"
   prop="ip_addresses"
   :rules="[ { type: 'array', required: true, message: '不能为空', trigger: ['blur', 'change'] } ]"
 >
 <el-select
   v-model="ip_address"
   multiple
   placeholder="请选择IP地址"
   style="width: 100%"
   @change="handleChange"
 >
   <el-option
     v-for="ip in ip_addresses"
     :key="ip.ip_address"
     :label="`${ip.ip_address}（${ip.name}）`"
     :value="`${ip.ip_address}|${ip.user_id}`"
   >
     <span style="float: left">{{ ip.ip_address }}</span>
     <span
       style="float: left; color: #8492a6; font-size: 13px"
     >（{{ ip.name }}）</span>
   </el-option>
 </el-select>
</el-form-item>

handleChange() {
  this.ruleForm.ip_address = [];
  this.ip_address.forEach(element => {
    let [ip_address, user_id] = element.split("|");
    this.ruleForm.ip_address.push({ ip_address, user_id });
  });
}

参考：https://www.jianshu.com/p/da2e59a42660