element-ui,router.push到其他路由,菜單欄不會高亮對應的路由


使用餓了嗎的路由,使用this.$router.push({path: ''})跳到其他的路由,菜單不會高亮。

如圖所示,點擊圖上三個位置,需要使用this.$router.push({path: ''})跳到其他的路由,但是跳過去之后,左側的菜單並不會高亮,查資料后說的是要把路由寫的和index一樣,但是沒有解決,后來才知道,使用vue的bus解決。

1.在assets文件夾下建js/bus.js

import Vue from 'vue'
export default new Vue()

2.在執行跳轉的頁面引入bus.js

import Bus from '@/assets/js/bus'

 /*
    *跳轉隨訪計划
    */
   toHz() {
      this.$router.push({path: '/PatientList'})
      Bus.$emit('activeIndex2','/PatientList')
    },

3.在home.vue監聽emit傳值

<el-menu :default-active="defaultActive" class="el-menu-vertical-demo" background-color="#465672" text-color="#c0d3f3" active-text-color="#eb683f" ref="elMenu" router @select="selectMenu">
//...
</el-menu>
//引入bus.js
import Bus from '@/assets/js/bus'
//監聽activeIndex2的內容

 mounted(){
    var self = this
    Bus.$on('activeIndex2',function(defaultActive) {
      self.defaultActive = defaultActive
    })
 },

emit傳值,on監聽,然后賦值給默認的:default-active,結束。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM