Foreword:
According to project requirements, in the modification function, it is required to display a drop-down box of a person, but the person ID must be passed when clicking submit. Generally, there are two solutions to this situation: one is to traverse the map through matching; the other is to obtain the person ID when selecting a person, and use the filter method .
Outline:
Example:
Key code:
obj: {
receiver:''
},
objOption: {
column: [{
label: 'XX号',
prop: 'xxNo',
}, {
label: 'XX人',
prop: 'xxman',
}, {
label: '报修内容',
prop: 'content',
disabled: true
}, {
label: '部门',
prop: 'dept',
formslot: true,
}, {
label: '接单人',
prop: 'receiverId',
type: 'select',
props: {
label: 'staffName',
value: 'staffId'
},
dicData: [],
rules: [{
required: true,
message: "请选择接单人",
trigger: "blur"
}],
}
]
},
submit() {
//map遍历匹配
this.objOption.column[4].dicData.map(item=>{
if(item.staffId == this.obj.receiverId){
this.obj.receiver = item.staffName
}
console.log('数据：',this.obj.receiver)
})
let params = {
orderIds: [this.obj.orderId],
receiverId: this.obj.receiverId,
receiver: this.obj.receiver,
};
console.log('派单params：',params)
API.workOrder(params).then(res => {
if (res.data.code === 0) {
this.$message({
type: 'success',
message: res.data.data
});
this.onLoad();
} else {
this.$message({
type: 'error',
message: res.data.data
});
this.onLoad();
}
});
},
dicData:[]In Vue, it usually represents an empty dictionary data array for storing key-value pairs (storing dictionary data)The so-called dictionary data is a collection of some key-value pairs, such as the correspondence between item classification and classification name. During the development process, we often need to use these dictionary data for data display, filtering and data binding operations. However, storing the dictionary data in an array can facilitate traversal, query and modification.
this.objOption.column[4].dicData.map obtains the data information with subscript 4 in objOption for map traversal matching
if(item.staffId == this.obj.receiverId){ this.obj.receiver = item.staffName}
If the selected recipient's receiverId is equal to staffId, then the recipient's name is obtained through item.staffName, and the recipient's Id is also passed to it;
Print data display:
