iview導航菜單updateOpened和updateActiveName的使用


先看官方文檔:  iview導航菜單 

這里主要遇到的問題有兩個:

1. 點擊回到首頁(B按鈕)時需要取消選中當前選中的菜單項(全部不選中),這里用到的是 updateActiveName方法

2. 點擊收起菜單(A按鈕)時,關閉所有展開的子菜單(只展示一級菜單),這里要用到的是 updateOpened方法

截圖如下:

 

先看下這兩個方法的文檔說明,直接看不是很清楚到底是怎么調用的,不斷的嘗試,其實並不難的哦

來看下最終的調用方法:

方法寫在methods里面,在點擊的按鈕標簽綁定該事件即可。

            /**
             * 手動更新選中的菜單
             */
            menuChange(){
                this.menuActive = "";  
                this.$nextTick(()=>{
                    this.$refs.menus.updateActiveName();
                })
            }    

注意上面的代碼順序哦!!!

1.  this.menuActive = ""; 寫在$nextTick前面!!!

2.  this.$refs.menus.updateActiveName();  要寫在$nextTick里面!!! 

剛開始我把 this.menuActive = ""; 和 updateActiveName方法都寫在了$nextTick里面,導致只有在刷新頁面,並只點了一次菜單的情況下,點擊跳轉首頁的時候才會取消選中菜單,然后再怎么點擊都沒有效果了。。

 同樣的,updateOpened方法也是這樣的寫法!


免責聲明!

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



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