由于公司項(xiàng)目的需要,我需要做一個(gè)類似樹形菜單的東西來顯示一個(gè)多級結(jié)構(gòu)吼拥,像這樣的
遇到問題
問百度呀惑折!
搜到了一篇看上去非常靠譜的:微信小程序-樹形菜單替代方案(鏈接)
這位老鐵的方案替我解決了大問題枯跑,不過似乎有一點(diǎn)不是很適合我的應(yīng)用場景惨驶,怎么辦
自己寫一個(gè)咯,大方向和他一樣敛助,不過我寫不出看上去那么高大上的代碼粗卜,就湊合著自己用叭,Let's GO ~
效果圖纳击,圖片有點(diǎn)小续扔。。就湊合著看吧焕数。纱昧。。
這是代碼鏈接 -->?代碼鏈接堡赔,
時(shí)間太久了源碼找不到了识脆,這上面的應(yīng)該是不全的,評論里有一位 @華子_tm 大兄弟的主頁里有一篇也是寫這個(gè)的加匈,可以參考
.JSON
"usingComponents": {
? ? "path-view": "/dist/path-view/index"
? }
.JS
page({
? ? data:{
? ? key:'deptName'存璃,
? ? deptList:[
? ? { deptName : ' 名稱 ' , deptId : ' ID ' , children : [ ] , userList : [ ] }
????]
????},
????selThis(e) {
? ? var user = e.detail.value;
? }
})
.wxml
<path-view list="{{ deptList }}" rootText="單位" bind:click="selThis" title="{{ key }}"></path-view>
因?yàn)樾枨蟮木壒实衿矗荒軉芜x,還需要做一個(gè)多選的粘招。啥寇。啊。洒扎。敲代碼好難啊辑甜。。
第一次用GitHub袍冷,有點(diǎn)方方的磷醋。。胡诗。繼續(xù)努力學(xué)習(xí)邓线。淌友。
上次做的這個(gè)菜單,經(jīng)理說不適應(yīng)我們平時(shí)的操作習(xí)慣啥的骇陈。震庭。
之前做的菜單,在部門那一行你雌,我點(diǎn)左邊可以打開面板看到部門下的人器联,我點(diǎn)右邊則可以進(jìn)到它的子部門,經(jīng)理說這個(gè)不符合我們的操作習(xí)慣婿崭,就我點(diǎn)一行拨拓,只能觸發(fā)一種操作,還有在選人的時(shí)候氓栈, 必須點(diǎn)文字或者點(diǎn)單選那個(gè)渣磷,有點(diǎn)困難,建議都增加到整個(gè)橫條上觸發(fā)颤绕,還有確定和取消按鈕幸海,取消按鈕完全可以不要,就很反人類
改0挛瘛N锒馈!氯葬!
還有就是之前做的是彈出窗口的模式挡篓,現(xiàn)在換成選人的時(shí)候跳到新的頁面,那怎么把選到到人返回給之前的頁面呢
var pages = getCurrentPages();
var prePage = pages[pages.length - 2]; //上一個(gè)頁面
這樣就可以直接setData了帚称,或者直接調(diào)用上一個(gè)頁面的方法