博客列表 >ElementUi - Tree 树形控件(躲坑)

ElementUi - Tree 树形控件(躲坑)

阿杰
阿杰原创
2022年10月08日 14:32:50649浏览

1、自定义节点内容

  • 按文档的来应该是下面的效果
  1. <el-tree
  2. :data="data"
  3. show-checkbox
  4. node-key="id"
  5. default-expand-all
  6. :expand-on-click-node="false">
  7. <span class="custom-tree-node" slot-scope="{ node, data }">
  8. <span>{{ node.label }}</span>
  9. <span>
  10. <el-button
  11. type="text"
  12. size="mini"
  13. @click="() => append(data)">
  14. Append
  15. </el-button>
  16. <el-button
  17. type="text"
  18. size="mini"
  19. @click="() => remove(node, data)">
  20. Delete
  21. </el-button>
  22. </span>
  23. </span>
  24. </el-tree>

  • 自己项目中

  • 鼠标移上去才显示自定义节点内容

  • 问题点就在于给了自定义节点标签个class

  • 去掉上面的class后,就可以得到想要的结果

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议