el-select 选中获取多个数据值
<el-select v-model="ruleForm.packageId" filterable remote clearable reserve-keyword :loading="shopLoading"
placeholder="请选择代理商套餐" size="small" style="width:360px" @change="selectChanelSel">
<el-option v-for="item in channelOptions" :key="item.id" :label="item.packageName" :value="item.id" />
</el-select>
ruleForm: {
agentId: null,
agentName: "",
packageId: null,
packageName: ""
},
channelOptions:[
{
"id": 3,
"packageName": "3",
"excessOrderCommission": 2,
"status": 2,
"effectiveStartTime": "2021-08-21 00:00:00",
"effectiveEndTime": "2021-08-31 23:59:59",
"blevelRebate": 2,
"clevelRebate": 2,
"alevelRebate": 3
},
{
"id": 6,
"packageName": "代理商套餐B",
"excessOrderCommission": 2,
"status": 1,
"effectiveStartTime": "2021-08-21 00:00:00",
"effectiveEndTime": "2021-08-31 23:59:59",
"blevelRebate": 2,
"clevelRebate": 2,
"alevelRebate": 3
}
]
//选中后传id值进行 查询获取对应数据
selectChanelSel(e) {
let packName = "";
this.channelOptions.forEach(item=>{
if(item.id == e){
packName = item.packageName;
}
})
console.log("packName->", packName);
this.ruleForm.packageName = packName;
console.log(' ruleForm ',this.ruleForm);
},
效果展示: