Vue ElementUI使用el-tree，只容许叶子结点有多选框

本文主要是介绍Vue ElementUI使用el-tree，只容许叶子结点有多选框，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

在使用el-tree时，我们需要多选功能会在el-tree标签添加show-checkbox属性：

那么，有时会遇到这样的需求，父节点不让多选，只容许多选叶子结点。那么，这时我们改怎么做呢？

通过调试工具：

多选框就是.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"  是否严格的遵循父子不互相关联的做法

这篇关于Vue ElementUI使用el-tree，只容许叶子结点有多选框的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---