一、elementui的級聯下拉列表默認只能選擇最末端的那個,如果需要點擊哪個就可以選擇哪個,需要做如下設置:
解決方法:在props屬性增加{checkStrictly: true
<el-cascader :props="{ checkStrictly: true, }" ></el-cascader>
二、這樣設置后又會出來1個問題級聯下拉框設置可選擇任意一級選項時前面會出現1個小圓圈以及選好后下拉面板不自動收起。
去掉單選框解決方法:在全局css文件中添加如下代碼:
.el-cascader-panel .el-radio {
width: 100%;
height: 100%;
z-index: 10;
position: absolute;
top: 0px;
right: 10px;
}
.el-cascader-node__label {
width: 157px;
}
.el-cascader-panel .el-radio__input {
visibility: hidden;
}
.el-cascader-panel .el-cascader-node__postfix {
top: 10px;
}
修改前:

修改后:

選好后下拉自動收到解決方法:
1,先給el-cascader 一個change事件
<el-cascader @change="cascaderSelectChange" ref="cascaderRef"
></el-cascader>
2,change事件函數:
cascaderSelectChange() {
// 自動收到下拉框
this.$refs.cascaderRef.dropDownVisible = false
},
最坑的是官網文檔根本沒提到dropDownVisible 這個屬性,網上找資料找半天,心累。。。。