vue使用（el-table）组件中 “ 父节点和子节点 ” 相关数据的【图标怎么自定义】？

问题是：当我在table中加入 “子集图标” 时，发现父节点也是存在图标的， 要求是只在子节点前加 “子集图标”，因此要将父节点的图标隐藏

方法一

但是前提是结合default-expand-all属性使用的，指是否默认展开所有行，默认是展开才能设置以下属性

 el-table组件，一般都是先找到相关的元素才能修改，父节点的class名是expanded，因此在以下这个样式里面修改

/deep/ .el-table__row.expanded{ // 父节点行样式名

  .know_icon{

    display: none !important; // 隐藏子集图标

  }

}

延申一下：

如果想要修改父节点行背景色，直接修改.el-table__row.expanded样式即可，效果如下：

/deep/ .el-table__row.expanded{

  background: gold;

  .know_icon{

    display: none !important;

  }

}

方法二

在这里是存在坑的，如果不想展开所有行的话，el-table标签下不需要加 default-expand-all，则只需找到el-table__expand-icon属性，并修改自定义的元素，此时是兄弟关系

修改el-table__expand-icon的兄弟元素 knowledge(自定义)

/deep/ .el-table__expand-icon+.knowledge{
  display: flex;
  .know_icon{
    display: none !important;
  }
}

延申一下：除箭头外，点文字任何地方展示下拉

<el-table
   :default-expand-all="expand"
   height="430"
   stripe
   :data="knowledgeData"
   row-key="id"
   :tree-props="{ children: 'children' }"
   @row-click="rowClick"
   ref="multipleTable">
   <el-table-column prop="knowledgeName" label="知识点" width="250"></el-table-column>
</el-table>

<script>
  methods: {
    // 点击表格一行的任意一个地方展开
    rowClick (row, column, event) {
      this.$refs.multipleTable.toggleRowExpansion(row)
    }
  }
</script>

      希望我的愚见能够帮助你哦~，若有不对的地方，还望指出，你们有更好的解决方法，欢迎大家在评论区下方留言支持，大家一起相互学习参考呀~