思路:1.把第一层的复选框去掉
2. 在第一层切换的时候,如果第一次分类改变了,把已有的值清空
html部分:
<el-cascader
:popper-class="'first-no-check-cascader'"
v-model="settingTypeValue"
:options="treeData"
:props="{
value: 'id',
label: 'name',
children: 'children',
emitPath: false,
multiple: true,
}"
:show-all-levels="true"
clearable
@expand-change="changeSourceType"
>
</el-cascader>
css部分:
// 级联选择器,第一级不需要复选框
.first-no-check-cascader {
.el-cascader-panel {
.el-cascader-menu:first-child {
.el-cascader-node {
.el-checkbox {
display: none !important;
}
}
}
}
}
函数部分:
cascaderTag:[], // 暂存点击时已有的tag
changeSourceType(selectItem) {
// 一级分类只能选一个,如果一级分类修改了,清空已有值
if (!this.cascaderTag.includes(selectItem[0])) {
this.settingTypeValue = [];
}
this.cascaderTag = selectItem;