Vue選單欄許可權

她早已目視前方從來都不回頭看,加快了步伐從不在乎年華已過半,堅定的眼神 過去的遺憾

話不多說，選單欄許可權( 根據後端返回的資料進行渲染 )

後台返回的資料結構( 未處理根據parentid 分離出父子級選單 有null為父級 沒有為子級)

[

,]

側邊導航欄資料結構( 處理後的結構 childrenmenulis如果為空說明就是個一級選單，如果有值說明有二級)：

處理返回的選單資料資料：

data中：

// 接收資料
menulistval: ,//接收所有選單資料
parentval: ,//父級選單資料
childbtnval: ,//子級選單資料
parentchildmap: ,
事件中：
menulist() 
else
if (item.parentid != null
) });
this.parentval.filter(items =>
});});
this.parentchildmap = this
.parentval;//可以迴圈遍歷資料了
// console.log(this.parentchildmap);
}); }
created() 

]

(

合併陣列或者物件在陣列或物件前面加 "..."，是es6的新寫法，然後陣列的map方法會返回陣列

)

data中：

//定義的圖示樣式
classicon: [,,
,,,,
,,,,
,],iconicon: 
事件中：
menulist() ;
//此時iconicon裡面就有name和圖示class了可以迴圈遍歷了
});}

:index="item.id"

v-show="item.switchstate"
v-if="item.childrenmenulis.length > 0"
style="text-align: left;padding-left: 24px;"
>
v-for="(icon, index) in iconicon"
:key="index"
:class="item.name == icon.name ? icon.iconclassname : ''"
>
}　　將父級名稱顯示出來在來觸發子級
} 跳轉的路由與子級名稱
style="text-align: left;padding-left: 44px;"
>
>
}導航名

建立選單欄

1 定義狀態列類 cstatusbar 2 呼叫creat 建立狀態列 3 呼叫setindicators 新增面板 4 呼叫setpaneinfo 設定面板寬度和樣式 5 呼叫setpanetext 設定狀態列面板文字 6 呼叫repositionbars 顯示狀態列 例項 現在對話方塊了中定義m...

導航選單欄製作

做法一 效果圖 導航選單.html charset gb2312 導航選單title rel stylesheet href style.css type text css head id daohang id d1 href 首頁a div id d2 關於醫學院div id d3 就業指導中心d...

Swing測試選單欄

public static void main string args jmenuitem openmenuitem new jmenuitem 開啟 開啟項事件 openmenuitem.addactionlistener new actionlistener catch exception e1...