如果遇到级联单选,选择这一项的时候需要拿到这一项的全部数据,而不只是id的集合,该如何拿到呢?
<el-form-item label="分公司:" prop="branchCode" required>
<el-cascader
style="width: 232px"
ref="transfer2"
collapse-tags
:show-all-levels="false"
v-model="ruleForm.branchCode"
:options="customerOptions"
:props="{
multiple: false,
checkStrictly: true,
emitPath: false,
value: 'value',
label: 'name',
children: 'children',
}"
clearable
@change="cascaderChange($event, 'branchCode')"
></el-cascader>
</el-form-item>
// 级联选择器选择的时候
cascaderChange(e, p) {
if (p == "branchCode") {
let valueChoose = this.$refs["transfer2"].getCheckedNodes(false);
if (valueChoose) {
this.ruleForm.branchName = valueChoose[0].label;
this.ruleForm.branchCode = valueChoose[0].value;
getChildDeptTree(valueChoose[0].value).then((res) => {
if (res.data.code == 0) {
this.businessList = res.data.data;
}
});
}
}
},
如果级联选择器多选的时候,点击选择的时候,却没有反显在选择框里面,先观察一下是不是数据的问题,有的是后台数据给children返回的是[],我们需要循环遍历,将其改为Null
<el-form-item label="组织机构" prop="deptIds">
<el-cascader
ref="transfer2"
collapse-tags
v-model="queryParams.deptIds"
:options="customerOptions"
:props="{
multiple: true,
emitPath: false,
checkStrictly: false,
value: 'value',
label: 'name',
children: 'children',
}"
clearable
></el-cascader>
</el-form-item>
// 处理部门树的数据
handleTreeData(list) {
list.forEach((element) => {
if (!element.children.length) {
element.children = null;
} else {
this.handleTreeData(element.children);
}
});
},
select选择器,选择某一项时,如何拿到整条数据对应的这一项?
<el-select
v-model="queryParams.provinceCode"
placeholder="省"
@change="selectChange('province', 'search', $event)"
>
<el-option
v-for="item in provinceList"
:key="item.code"
:label="item.name"
:value="item.code"
>
</el-option>
</el-select>
</el-form-item>
// 选择值改变的时候
selectChange(p, p1, e) {
if (p == "province") {
getCityList(e).then((res) => {
this.cityList = res.data.data;
});
} else if (p == "city") {
getdistrictList(e).then((res) => {
this.districtList = res.data.data;
});
}
if (p1 == "add") {
if (p == "province") {
const selectedItem = this.provinceList.find(
(item) => item.code === e
);
this.ruleForm.province = selectedItem.name;
} else if (p == "city") {
const selectedItem = this.cityList.find((item) => item.code === e);
this.ruleForm.city = selectedItem.name;
} else if (p == "district") {
const selectedItem = this.districtList.find(
(item) => item.code === e
);
this.ruleForm.district = selectedItem.name;
}
}