elementUI tree 连接线

Element UI 的 Tree 组件默认没有提供连接线的功能。不过你可以通过自定义样式来实现连接线的效果。以下是一个示例的方法：

1. 在 Tree 组件的父元素上添加一个 class，比如 `custom-tree`。

2. 使用 CSS 样式为 Tree 的子元素添加连接线效果。可以使用 `::before` 和 `::after` 伪元素来创建连接线，然后通过设置宽度、背景色等属性来控制连接线的样式。

.custom-tree .el-tree-node {
  position: relative;
}

.custom-tree .el-tree-node::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 100%;
  background-color: #ccc; /* 设置连接线的颜色 */
}

.custom-tree .el-tree-node::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 15px; /* 设置连接线的长度 */
  height: 1px;
  background-color: #ccc; /* 设置连接线的颜色 */
}

.custom-tree .el-tree-node.is-leaf::before {
  display: none; /* 去除叶子节点的竖线 */
}

3. 在 Tree 组件上添加自定义的 class `custom-tree`，即可看到添加了连接线的效果。

<el-tree class="custom-tree"></el-tree>

以上是一种简单的实现方法，你可以根据具体的需求进行调整。希望对你有帮助！