欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Element树形控件整合带图标的下拉菜单(tree+dropdown+input)

程序员文章站 2022-03-07 08:46:53
本文主要讲述:自定义树形控件需求说明:element ui 官网提供的树形控件包含基础的、可选择的、自定义节点内容的、带节点过滤的以及可拖拽节点的树形结构 如下:我想要的...

本文主要讲述:自定义树形控件<el-tree>

需求说明:

element ui 官网提供的树形控件包含基础的、可选择的、自定义节点内容的、带节点过滤的以及可拖拽节点的树形结构 如下:

Element树形控件整合带图标的下拉菜单(tree+dropdown+input)

我想要的效果是支持搜索效果的树,将鼠标悬浮后显示添加修改图标,点击图标后弹出对应页面;并且在每个文件夹前添加自定义图标。

实现效果:

Element树形控件整合带图标的下拉菜单(tree+dropdown+input)

实现步骤:

1、使用插槽(slot)

2、组件对应的js

注意:树的数据是从后端查询回来的,保存在dirtreeoptions里面

说明:

参考文档:element ui

到此这篇关于element树形控件整合带图标的下拉菜单(tree+dropdown+input)的文章就介绍到这了,更多相关element带图标的下拉菜单内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!