复制代码<el-tree
class="tree-line"
:data="treeOption"
:props="defaultProps"
@node-click="getCurrentNode"
>
- 1
- 2
- 3
- 4
- 5
- 6
利用样式添加虚线指示
复制代码.el-tree-style{
/deep/ .el-tree-node {
position: relative;
}
/deep/ .el-tree-node__children {
padding-left: 16px;
}
/deep/ .el-tree-node::before {
content: '';
height: 100%;
width: 1px;
position: absolute;
left: 30px;
top: 0;
border-width: 1px;
border-left: 1px dashed #ddd;
}
/deep/ .el-tree-node:last-child::before {
height: 38px;
}
/deep/ .el-tree-node::after {
content: '';
width: 15px;
height: 20px;
position: absolute;
left: 30px;
top: 12px;
border-width: 1px;
border-top: 1px dashed #ddd;
}
& > .el-tree-node::after {
border-top: none;
}
& > .el-tree-node::before {
border-left: none;
}
.el-tree-node__expand-icon {
font-size: 16px;
&.is-leaf {
color: transparent;
}
}
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
标签: el-tree组件, element-ui
上面是“el-tree组件如何添加虚线指示”的全面内容,想了解更多关于 vuejs 内容,请继续关注web建站教程。
当前网址:https://ipkd.cn/webs_4410.html
workflows工作流
一只可爱的草莓味冰淇淋卷筒
海中一头鲸鱼ComfyUI工作流
王家卫电视剧繁花海报效果comfyui工作流
一头巨大的古代大象背后建着一座城市
一张精心制作的熊岛复古地图ComfyUI工作流
蘑菇屋,梦幻家园comfyui工作流
一位穿着优雅银色装饰黑色连衣裙的苗条模特
基础扩图comfyui工作流
猜你喜欢
声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!