前端路上那些坑——编辑、详情作为二级页面时query传参的问题（弹窗的编辑，详情另议）

场景：创建/编辑，详情属于内部页面，从创建/编辑切换页签之后再切回来，需要保留输入的内容（此处使用keep-alive实现），页面布局类似vue-element-admin

 

编辑使用query传参（id）

 

切换页签

 

保留编辑页面（存vuex中id和path（存path是为了点击侧导航时可以跳转到对应的内部页面））

 

切换页签后刷新（vuex中的id和path丢失）=》整个项目中不支持刷新，才能保证缓存正常

 

但是不能保证奇葩用户不这么操作，那么刷新后：

 

切回当前页面（query没有参数）=》（变成创建））

 

编辑可以变创建，不报错，那么详情页呢？

 

详情页在导航守卫中需要判断是否有id，没有拦回列表页，防止刷新后切换回页签直接进入详情页由于没有id，接口报错