Vue組件tree實(shí)現(xiàn)樹形菜單
更新時(shí)間：2017年04月13日 14:05:36 作者：Stephen__
這篇文章主要為大家詳細(xì)介紹了Vue組件tree實(shí)現(xiàn)樹形菜單，小巧實(shí)用，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
vue 編寫的樹形菜單，小巧實(shí)用，支持vue1.0，vue2.0
v1.0 功能:
1.支持多級(jí)樹目錄
2.支持高亮點(diǎn)擊的節(jié)點(diǎn)
3.支持展開點(diǎn)擊節(jié)點(diǎn)
4.支持點(diǎn)擊收縮節(jié)點(diǎn)時(shí)收縮所有子目錄
5.支持自定義回調(diào)函數(shù)，點(diǎn)擊節(jié)點(diǎn)時(shí)回調(diào)，參數(shù)為節(jié)點(diǎn)信息
用法：<launch-tree :list='list' :options='options'></launch-tree>
list = [
{
name: '一級(jí)目錄', // 目錄名字
isOpen: true, // 是否初始展開目錄
hightLight: true, // 是否初始高亮
className: undefined, // 添加自定義樣式
childs: [], // 二級(jí)目錄
...{} // 其他用戶額外參數(shù)
}
]
options = {
callback: undefined // 自定義點(diǎn)擊事件，callback(node)
}
github地址
圖示：
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
- vue遞歸實(shí)現(xiàn)樹形組件
- Vue組件庫(kù)ElementUI實(shí)現(xiàn)表格加載樹形數(shù)據(jù)教程
- Vue遞歸組件+Vuex開發(fā)樹形組件Tree--遞歸組件的簡(jiǎn)單實(shí)現(xiàn)
- vue用遞歸組件寫樹形控件的實(shí)例代碼
- 用 Vue.js 遞歸組件實(shí)現(xiàn)可折疊的樹形菜單(demo)
- Vue.js遞歸組件構(gòu)建樹形菜單
- vuejs使用遞歸組件實(shí)現(xiàn)樹形目錄的方法
- 基于 Vue 的樹形選擇組件的示例代碼
- Vue組件模板形式實(shí)現(xiàn)對(duì)象數(shù)組數(shù)據(jù)循環(huán)為樹形結(jié)構(gòu)(實(shí)例代碼)
- vue實(shí)現(xiàn)自定義樹形組件的示例代碼
相關(guān)文章
這篇文章主要介紹了Vue+ ArcGIS JavaScript APi,文中需要注意ArcGIS JavaScript3.x 和ArcGIS JavaScript 4.x框架差異較大，本文從環(huán)境搭建開始到測(cè)試運(yùn)行給大家講解的非常詳細(xì)，需要的朋友可以參考下2022-11-11
vue解決一個(gè)方法同時(shí)發(fā)送多個(gè)請(qǐng)求的問(wèn)題
今天小編就為大家分享一篇vue解決一個(gè)方法同時(shí)發(fā)送多個(gè)請(qǐng)求的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
vue+element-ui+sortable.js實(shí)現(xiàn)表格拖拽功能
這篇文章主要為大家詳細(xì)介紹了vue+element-ui+sortable.js實(shí)現(xiàn)表格拖拽功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-04-04
本篇文章主要給大家詳細(xì)代碼講解了vue2.0 elementUI制作面包屑導(dǎo)航欄的過(guò)程，對(duì)此有興趣的朋友可以學(xué)習(xí)下。2018-02-02
使用Vue開發(fā)動(dòng)態(tài)刷新Echarts組件的教程詳解
這篇文章主要介紹了使用Vue開發(fā)動(dòng)態(tài)刷新Echarts組件的教程詳解,需要的朋友可以參考下2018-03-03
使用ElementPlus的Table啥都好，就是沒(méi)有可編輯表格，所以這篇文章就來(lái)和大家分享一下Vue實(shí)現(xiàn)極致舒適的可編輯表格的方法，希望對(duì)大家有所幫助2023-06-06
淺談vue方法內(nèi)的方法使用this的問(wèn)題
今天小編就為大家分享一篇淺談vue方法內(nèi)的方法使用this的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)條件疊加搜索的解決方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-05-05
解決vue運(yùn)行報(bào)錯(cuò)Error:Cannot?find?module?'@vue/cli-plugin-b
解決了因?yàn)榘姹締?wèn)題在創(chuàng)建項(xiàng)目時(shí)出現(xiàn)的各種報(bào)錯(cuò)問(wèn)題,這次在運(yùn)行時(shí)出現(xiàn)的問(wèn)題,下面這篇文章主要給大家介紹了關(guān)于解決vue運(yùn)行報(bào)錯(cuò)Error:Cannot?find?module?'@vue/cli-plugin-babel'的相關(guān)資料,需要的朋友可以參考下2023-04-04
element-ui中表格設(shè)置正確的排序及設(shè)置默認(rèn)排序
表格中有時(shí)候會(huì)有排序的需求,下面這篇文章主要給大家介紹了關(guān)于element-ui中表格設(shè)置正確的排序及設(shè)置默認(rèn)排序的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-05-05