vue鉤子函數beforeRouteEnter

vue鉤子函數beforeRouteEnter

beforeRouteEnter 函數內部的 this 爲 undefined,這是因爲 beforeRouteEnter 是在頁面創建前就執行的,
先執行 beforeRouteEnter,再執行生命週期鉤子函數 beforeCreate、created 等。

beforeRouteEnter 有三個參數,to、from、next
to:裏面是當前頁面的路由對象。
from:裏面是上一個頁面的路由對象。
next:表示進入當前頁面,beforeRouteEnter 內必須執行 next() ,否則無法進入頁面,可以傳入參數 vm 訪問組件實例,相當於 this

下面是一個簡單的例子:

beforeRouteEnter (to, from, next) {    
      if (sessionStorage.getItem("username")) {  //本地存儲取到用戶名,表示已登錄
        next(true)
      } else { // 未登錄
        next(vm => {    // 通過參數 `vm` 訪問組件實例
          vm.$router.push('/index') // 返回首頁
          alert("請登錄")
        })
      }
    }
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章