組件內的導航守衛

beforeRouteEnter 是組件內的路由導航守衛，在確認渲染該組件的對應路由前調用。該守衛不能訪問 this，但我們通過傳一個回調給 next，就可以使用上面的 vm 來訪問組件實例。守衛的參數說明如下：

• to：即將要進入的目標路由；
• from：當前導航正要離開的路由，from.name 是路由的名稱，對應路由配置中的 name；
• next：一個用來 resolve 當前鈎子的方法，需要調用該方法來確認或者中斷導航；

參數 to 和 from 都是 路由對象 （route object），表示當前激活的路由的狀態信息，其常用的屬性有：

name：路由的名稱，如 'Register'；
path：路由的路徑，如 '/auth/register'；
params：路由參數對象，如 { id: "1" }；
query：URL 查詢參數對象，如 { page: "1" }；
meta：元信息對象，如 { auth: true }；

// 組件內的路由導航守衛
beforeRouteEnter(to, from, next) {
  // 路由的名稱，對應路由配置中的 name
  const fromName = from.name

  // 確認導航
  next(vm => {
    // 通過 vm 參數訪問組件實例，已登錄時，評估路由名稱
    if (vm.$store.state.auth) {
      switch (fromName) {
        // 如果從注冊頁面跳轉過來
        case 'Register':
          // 顯示注冊成功
          vm.showMsg('注冊成功')
          break
      }
    }
  })
}