美文网首页Vue2.x笔记
Vue2.x全局路由钩子使用

Vue2.x全局路由钩子使用

作者: YLPeach | 来源:发表于2017-06-22 16:01 被阅读66次

    Vue2.x全局路由钩子使用

    router.js文件

    • 直接在main.js中直接引用就可以
    import Vue from 'vue'
    import VueRouter from 'vue-router'
    
    import NotFound from '../404.vue'
    import Hello from '../components/Hello.vue'
    
    Vue.use(VueRouter)
    
    let routes = [
      {
        path: '/404',
        component: NotFound,
        name: '404',
      },
      {
        path: '/',
        name: 'Hello',
        component: Hello
      } ,
      {
        path: '*',
        redirect: { path: '/404' }
      }
    ]
    
    // 全局路由钩子
    const router = new VueRouter({
      routes
    })
    router.beforeEach((to, from, next) => {
      console.log('路由钩子')
      console.log(to)
      console.log(from)
      next()
    })
    
    export default router
    

    相关文章

      网友评论

        本文标题:Vue2.x全局路由钩子使用

        本文链接:https://www.haomeiwen.com/subject/xmyfcxtx.html