element Tree 只让叶子节点显示复选框

//只让叶子节点显示复选框

.resourceBrowsing .el-tree-node {

.is-leaf + .el-checkbox .el-checkbox__inner {

display:inline-block;

    }

.el-checkbox__input>.el-checkbox__inner {

display:none;

    }

}




多选框就是.el-checkbox这个样式,那么我们只需把这个样式覆盖一下,把它隐藏掉:

/deep/ .el-tree-node{

      .is-leaf + .el-checkbox .el-checkbox__inner{

          display: inline-block;

      }

      .el-checkbox .el-checkbox__inner{

          display: none;

      }

  }

注意:/deep/ 是强穿透,也可以写成<<< ,只在当前组件文件起作用,不改变整个页面样式。

最后别忘了在el-tree组件加上 :check-strictly="true"  是否严格的遵循父子不互相关联的做法

————————————————

版权声明:本文为CSDN博主「不知名码农1994」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。

原文链接:https://blog.csdn.net/u013025674/article/details/101369949

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容