el-cascader__点击文字可选中__去掉单选按钮__选中后菜单收起__自定义数据显示在选项中（已测有用）

效果图

直接上代码：
注意：css样式一定要全局设置，不要写在scoped下（否则没效果）

<el-cascader
            v-model="form.classify"
            ref="cascader"
            :options="dataList"
            :props="defaultProps"
            clearable
            popper-class="cascader"
             @change="onSubmit"
          ></el-cascader>
 

//在此处定义popper-class，是因为下面设置的样式需要全局设置才生效，使用定义的类，将不会影响其他页面的效果

export default {
    data() {
      return {
        formInline:{classify:""},   
        dataList: [{
                  id:1,
                  name:"haha"
                  }],
       defaultProps: {
	        value: "id",
	        label: "name",        
	        expandTrigger: 'hover' ,        
	        checkStrictly: true,
	        emitPath: false,
         }
      }},
      methods: {
	      onSubmit() {//选中之后，自动关闭菜单项
	        this.$refs.cascader.toggleDropDownVisible();
	      }
    }
 }

// 此处dataList并不是按照el-cascader定义的value,lable定义的属性名，所以此处要做转换

// 级联选择器el-cascader，通过点击label文字部分选中
.cascader {
  .el-cascader-panel{
     .el-radio{
      width: 100%;
      height: 100%;
      z-index: 10;
      position: absolute;
      top: 10px;
      right: -10px;
      }
      .el-radio__input{
        visibility: hidden;  //隐藏单选框，不隐藏就不用设置
      }
      .el-cascader-node__postfix{
        top: 10px;
      }
  }
}

标签：__,el,定义,单选,10px,cascader,选中
来源： https://blog.csdn.net/weixin_38345306/article/details/121036230