multiple 多选的属性,collapse-tags 多选的样式,dataDictPO 选择器需要展示的数据
<el-select v-model="serveValue" placeholder="请选择" size='mini' multiple collapse-tags @change="selectContract">
<el-option
v-for="item in dataDictPO"
:key="item.itemCode"
:label="item.itemName"
:value="item.itemCode">
</el-option>
</el-select>
//获取合同服务类型的name值
selectContract(vId){
// vID 是一个数组,循环获取name,根据id
if (!vId && vId.length === 0) {
return ;
}//这里多选的时候获取name和单选不一样 单选是对象 多选是数组所以...
let nameArr = [];
let codeArr = [];
let that = this;
vId.forEach(element => {
let obj = that.dataDictPO.find((item)=>{
return item.itemCode === element;
});
if (obj) {
nameArr.push(obj.itemName);
codeArr.push(obj.itemCode);
}
});
this.name = nameArr.join();
},
既然多选的name都可以获取到那单选的怎么获取到呢 看下面
multiple 单选不需要加,paymentValue 选择器需要展示的数据
<el-select v-model="paymentValue" placeholder="请选择" size='mini' @change="selectGet">
<el-option label="" value=""></el-option>
<el-option
v-for="item in datapayment"
:key="item.itemCode"
:label="item.itemName"
:value="item.itemCode">
</el-option>
</el-select>
selectGet(vId){
let obj = {};
obj = this.datapayment.find((item)=>{
return item.itemCode === vId;//筛选出匹配数据
});
this.itemName = obj.itemName
// console.log(obj.itemName);//我这边的name就是对应label的
// console.log(obj.itemCode);
},
还有一点就是其实 v-model 可以直接获取到id但是name需要自己去遍历