Vue 前置路由守卫，router.beforeEach未生效

带佬们，问问为什么不生效呢？

import Vue from 'vue'
import Router from 'vue-router'


import HelloWorld from '@/components/HelloWorld'
import Login from '@/components/Login'
import Vuex from '@/components/Vuex.vue'

Vue.use(Router)

const router = new Router({});

export default new Router({
  mode: 'history',
  routes: [{
      path: '/HelloWorld',
      name: 'HelloWorld',
      component: HelloWorld,
      meta: {
        requireAuth: true
      }
    },
    {
      path: '/',
      name: 'Login',
      component: Login
    },
    {
      path: '/Vuex',
      name: 'Vuex',
      component: Vuex,
      meta: {
        requireAuth: true
      }
    }
  ]
})


router.beforeEach((to, from, next) => {

  console.log("111111111")
  next();

})

router.beforeEach((to, from, next) => {
 
  console.log("111111111")
  next();
 
})

你放到main.js里面就好了，如有帮助，请采纳一下哦~谢谢O(∩_∩)O

个人之见，你这个router啥也没有，是空的，export default new Router这个里面的路由跳转跟router没有关系，所以没有生效，试一下下面的

const router = new Router({
  mode: 'history',
  routes: [{
      path: '/HelloWorld',
      name: 'HelloWorld',
      component: HelloWorld,
      meta: {
        requireAuth: true
      }
    },
    {
      path: '/',
      name: 'Login',
      component: Login
    },
    {
      path: '/Vuex',
      name: 'Vuex',
      component: Vuex,
      meta: {
        requireAuth: true
      }
    }
  ]
});
 
export default router

router.beforeEach((to, from, next) => {
 
  console.log("111111111")
  next();
 
})

感谢各位，已经解决了。

import Vue from 'vue'
import Router from 'vue-router'

import HelloWorld from '@/components/HelloWorld'
import Login from '@/components/Login'
import Vuex from '@/components/Vuex.vue'
import Index from '@/components/Index.vue'

// Vue.use(Router)

// // const router = new Router({});

// // router.beforeEach((to, from, next) => {

// //   console.log("111111111")
// //   next();

// // })

// export default new Router({
//   mode: 'history',
//   routes: [{
//       path: '/HelloWorld',
//       name: 'HelloWorld',
//       component: HelloWorld,
//       meta: {
//         requireAuth: true
//       }
//     },
//     {
//       path: '/',
//       name: 'Login',
//       component: Login
//     },
//     {
//       path: '/Vuex',
//       name: 'Vuex',
//       component: Vuex,
//       meta: {
//         requireAuth: true
//       },
//       // beforeEnter: (to, from, next) => {
//       //   console.log("vueveuveuvuueuveuveuvueue")
//       //   next();
//       // }
//     }
//   ]
// })


//引入vuex仓库在路由器安置守卫进行判断使用
import store from '../store/index.js'
Vue.use(Router)

const route = new Router({
  routes: [{
      path: '/HelloWorld',
      name: 'HelloWorld',
      component: HelloWorld,
      meta: {
        requireAuth: true
      }
    },
    {
      path: '/Login',
      name: 'Login',
      component: Login
    },
    {
      path: '/Vuex',
      name: 'Vuex',
      component: Vuex,
      meta: {
        requireAuth: true
      },
      // beforeEnter: (to, from, next) => {
      //   console.log("vueveuveuvuueuveuveuvueue")
      //   next();
      // }
    },
    {
      path: '/',
      name: 'Index',
      component: Index
    }
  ]
})
//每一个路由跳转之前都会走前置方法
route.beforeEach((to, from, next) => {
  //to表示要去的路由的信息
  //from表示来自哪个路由的信息
  //next 执行next()继续走路由  next('/xxx')跳转到具体路由
  console.log(store, 'storestore')
  console.log(to.fullPath)
  //要去的路由是否需要截拦
  if (to.meta.requireAuth) {
    //判断 token 或者 user 是否存在
    if (store.state.user != '' && store.state.token != '') {
      //不为空跳转
      console.log('验证成功，用户已登录！')
      next();
    } else if (store.state.token == '') {
      console.log(store.state.token, '令牌已失效', store.state.token)
      alert("令牌已失效!"+store.state.token)
      next('/Login')
    } else {
      //账号等于空  说明没登陆 还让他留在登录页面 或者想通过路由直接跳转刀对应页面 由于没有username  也直接到了login页面
      console.log(store.state.user, '账号等于空', store.state.user)
      alert("账号未登录!"+store.state.token)
      next('/Login')
    }
  } else {
    //是登录页面
    console.log('无需截拦页面')
    next()
  }

})
export default route