el-tree只有叶子节点才显示勾选框vue-element

实现效果：

 

template中：引用element的el-tree，其中show-checkbox为显示勾选框，选择true，默认所有节点均有勾选框。

<el-tree
          class="tree"
          :check-strictly="true"
          :data="datatree"
          :render-content="eventRender"
          :show-checkbox="true"     //首先引用tree的时候全部显示选择框
          :props="defaultProps"
          ref="reTree"
          node-key="treeID"
          @node-click="handleNodeClick"
          @check="currentData"
        ></el-tree>

在style中：

.el-tree-node {
  .is-leaf + .el-checkbox .el-checkbox__inner {
    display: inline-block;
  }
  .el-checkbox .el-checkbox__inner {
    display: none;
  }
}

若是加入此段代码没有效果，可尝试在类名前加/deep/进行深度穿透，这样就实现了。