vue+Element框架menu菜單刷新後保持選中狀態

一直以來沒有養成記錄分享的習慣,後面發現這樣很很差,因此開了本身的博客園,但願和你們一塊兒進步!

  前段時間用vue+Element作了一個後臺項目，其中用Element的menu菜單組件的時候遇到一個問題。點擊選中某個菜單，刷新後，選中狀態會消失。苦思無果，因而網上查看了一下，不少都寫到用default-active屬性進行設置,至於設置方法對於小白來講看的有點懵.後來終於看到一個大神寫的方法很簡單好用,因此記錄下來!

其實很簡單,在路由設置裏給每一個頁面跳轉項設置一個name屬性,屬性值就是el-menu-item 裏面的index值,具體看下圖:

如今路由中爲每一個跳轉的頁面配置name屬性,屬性值就是el-menu-item 裏面的index值,菜單組裏面的default-active設置一個屬性active進行綁定.

 

綁定一個自定義屬性active,用來控制當前選中哪一個菜單.

 

接下來只要在頁面渲染的時候讓active等於當前路由下的name屬性就能夠了,這樣刷新後選中狀態依然保留了!

第一次寫隨筆記錄,大神勿噴!

原文參考連接:https://www.jb51.net/article/130473.htm