组件内的导航守卫

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 }；

 1 // 组件内的路由导航守卫
 2 beforeRouteEnter(to, from, next) {
 3   // 路由的名称，对应路由配置中的 name
 4   const fromName = from.name
 5 
 6   // 确认导航
 7   next(vm => {
 8     // 通过 vm 参数访问组件实例，已登录时，评估路由名称
 9     if (vm.$store.state.auth) {
10       switch (fromName) {
11         // 如果从注册页面跳转过来
12         case 'Register':
13           // 显示注册成功
14           vm.showMsg('注册成功')
15           break
16       }
17     }
18   })
19 }