带有vue路由器beforeEach和子路径的无限循环

是指在Vue.js中使用vue-router时，通过beforeEach导航守卫进行路由跳转时，可能会出现无限循环的情况。

在Vue.js中，vue-router是用于实现前端路由的官方插件。它允许我们通过定义路由规则来管理不同页面之间的跳转和展示。而beforeEach导航守卫是vue-router提供的一种钩子函数，用于在路由跳转之前进行拦截和处理。

当在beforeEach导航守卫中进行路由跳转时，如果在跳转的目标路由中又包含了beforeEach导航守卫，并且这两个路由之间存在子路径关系，就有可能导致无限循环的情况发生。

这种无限循环的原因是在每次路由跳转时，beforeEach导航守卫会被触发，然后再次进行路由跳转，如此循环下去。

为了解决这个问题，可以在beforeEach导航守卫中添加一个判断条件，例如使用一个标志位来记录是否已经进行过路由跳转，避免重复触发导航守卫。

以下是一个示例代码：

// main.js
import Vue from 'vue'
import VueRouter from 'vue-router'
import App from './App.vue'

Vue.use(VueRouter)

const router = new VueRouter({
  routes: [
    // 路由配置
  ]
})

router.beforeEach((to, from, next) => {
  // 判断是否已经进行过路由跳转
  if (to.meta.isNavigated) {
    next()
  } else {
    // 设置标志位，避免重复触发导航守卫
    to.meta.isNavigated = true
    next(to)
  }
})

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

在上述示例代码中，我们通过给目标路由的meta字段添加一个isNavigated属性来记录是否已经进行过路由跳转。在beforeEach导航守卫中，判断该属性的值，如果为true，则直接进行下一步操作；如果为false，则将isNavigated设置为true，并重新进行路由跳转。

需要注意的是，这只是一种解决方案，具体的实现方式还需要根据具体的业务场景和需求进行调整。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云云数据库MySQL。