el-tree子节点带复选框
时间: 2023-10-13 08:05:57 浏览: 92
ElementUI中el-tree节点的操作的实现
el-tree的子节点带有复选框的样式可以通过修改CSS样式来实现。根据提供的引用内容,你可以使用以下CSS代码来实现子节点带复选框的样式:
```css
.el-tree-node {
/* 叶子节点显示复选框,其他节点不显示复选框 */
.is-leaf ~ .el-checkbox .el-checkbox__inner {
display: flex;
}
.el-checkbox__input > .el-checkbox__inner {
display: none;
}
}
/* 非一级节点 */
.el-tree-node__children {
/* 节点展开显示复选框 */
.expanded ~ .el-checkbox .el-checkbox__inner {
display: flex;
}
.el-checkbox__input > .el-checkbox__inner {
display: none;
}
}
```
这段代码可以使一级节点不显示复选框,其他子节点在收起状态下不显示复选框,展开状态下显示复选框,叶子节点显示复选框。
阅读全文