ElementUI中el-tree树形结构加线条 默认三角形改成加减号

在ElementUI中，可以通过覆盖默认的CSS样式来实现自定义树形控件的节点图标。以下是一个例子，展示如何将默认的三角形图标改成加减号：

首先，在你的组件的<style>标签中或者单独的CSS文件中添加以下CSS样式：

/* 隐藏默认的三角形图标 */
.el-tree .el-tree-node__expand-icon.is-leaf {
  display: none;
}
 
/* 显示自定义的加号图标 */
.el-tree-node__content:before {
  content: '+';
  color: #606266;
  margin-right: 5px;
  font-weight: bold;
}
 
/* 当节点展开时，显示减号图标 */
.el-tree .el-tree-node__expanded > .el-tree-node__content:before {
  content: '-';
}

这段CSS代码做了以下几点修改：

1. 隐藏了默认的三角形图标，因为我们要用加减号来控制节点的展开和折叠。
2. 在所有节点前添加了加号，作为默认的节点图标。
3. 当节点展开时，加号图标会被减号图标替换。

接下来，确保你的组件中有一个el-tree组件，并确保已经正确引入并使用了ElementUI。

<template>
  <el-tree
    :data="treeData"
    :props="defaultProps"
    node-key="id"
    default-expand-all
  ></el-tree>
</template>
 
<script>
export default {
  data() {
    return {
      treeData: [
        // ...你的树形数据
      ],
      defaultProps: {
        children: 'children',
        label: 'label'
      }
    };
  }
};
</script>
 
<style>
/* 上面提供的CSS样式 */
</style>

这样，你就会得到一个带有加减号图标的树形结构。当然，你可以根据需要自定义图标的样式，比如颜色、大小等。