vue.js 使用vue-router的动态路由时,为什么刷新就没了那个组件了

1、取出非第一级的所有数据 2、映射出所有路由规则 3、添加路由 4、 登录成功后 保存菜单数据，保存后在vuex直接触发添加事件即可 this.commit('add_route')

目前在使用VUE3.X开发，发现加载动态路由的话，由于刷新页面就会重新加载VUEX，故会丢失已存在的state，但是又不想localStorage，sessionStorage。经过多次试验，采取在权限验证里面的路由守卫里，添加 检测如果存在路由则跳转下一步，不存在则再次进入获取用户信息和路由的判断 if (store.getters.permission_rout...

解释一下：当我们使用 动态路由 或者在 路由上拼接参数 时，进行页面组件跳转,如果前后跳转都使用了同一个组件，这就导致我们后面的路由跳转会使用前一次组件实例，因此组件不会重新渲染加载 当我们想传递参数后，组件重新渲染组件实例，可以使用vue官方文档提供的方案：如果我们对"路由变化作出响应是"===>...

Vue-router 动态路由的核心功能在于统一处理符合特定模式的路由映射。当你需要将所有诸如/user/:id的路径指向同一个组件，如UserComponent，动态路由就派上用场了。这里的“:id”是动态参数，表示路由中的一部分是变量。在配置路由时，Vue-router 提供了便捷的方法。例如，为了匹配/user/123这样的路径，...

小伙伴，我刚才试了一下，我直接在我的根模板（每个页面都算是从这里开始渲染的），也是路由位置“/”使用的模板。直接路由跳转就实现了刷新回到首页 export default{mounted:function(){this.$router.push('/');}}

在Vue项目中配置动态路由主要分为两种情况：简单和复杂的角色权限设置。简单角色权限设置时，通常在前端进行简单的角色权限配置。步骤如下：配置项目路由权限 新建一个公共的asyncRouter.js文件 创建路由守卫，设置在permission.js文件中 在main.js中引入permission.js文件 在登录时将角色信息存储...

意思很明显了：虽然路由参数发生了变化，但组件还是那个组件，Vue生命周期也还没结束，此时并不会刷新数据。（个人认为，开发spa页面，一切都是以路由为起点的，路由变化，页面跟着变化，复用组件竟然会影响到路由，很难受！！）不过，官网也提出了相应的解决方案：复用组件时，想对路由参数的变化作出响应的...

在此之前添加路由只需要把后端返回的结构树放到 addRouters中就可以 router4更新后 废除了addRouters 新增addRoute 下面介绍一下addRoute的用法

在使用vue-cli2进行打包的时候，出现了一个问题和上面博主的博客中描述的一样，在我们第一次去请求的过程中，router路由下的请求回来的界面是正常的，但是当我们强制刷新的时候，我们的屏幕就是一篇空白，存在两种情况：第一种:简单路由下，刷新也会出现问题；第二种：复杂路由下，刷新也会出现问题 解决...

如果在 Vue 项目中，您尝试直接使用后端数据动态地添加路由并跳转，可能会遇到问题，因为动态添加的路线可能不会正确地注册到 Vue Router 中，导致无法找到对应的视图组件。为了解决这个问题，您可以考虑将动态添加路由的逻辑放在 `router.beforeEach` 钩子函数中，以确保在导航之前正确地设置路由。