你这个其实属于多页面,可以将单页改为多页
https://cli.vuejs.org/zh/config/#pages
路由信息可以放到一个数组中。左侧菜单递归渲染,监听路由跳转后渲染新路由
思路: 存放到localstorage, 在main.js执行new VueRouter的时候, 获取localstrong参数, 根据参数判断是dev的话就设置dev路由.
当你页面点击的时候, localstorage就保存const参数, 并刷新页面.
代码:
// 获取路由参数, 如果为空默认dev路由
localStorage.getItem("router") || "dev";
// 切换路由并刷新页面
localStorage.setItem("router", 'dev');
location.reload();
// main.js 入口在实例化路由前判断需要用的路由
new VueRouter({
...
routes: localStorage.getItem("router") === 'dev' ? devRoutes : constantRoutes
})