如何实现正常打开页面和跳转页面结果不同,并且都有缓存?

164 阅读2分钟

需求如下:页面a是菜单栏的一个目录,正常打开页面a,默认选中select为自己单位的选项.此时有一个页面b,是由表格组成的,表格里面有一些不同单位的数据,点击对应的单元格要携带参数跳转到页面a,并且根据页面b传递的参数来使页面a选中与之有关联的select。

1.解决方法: 首先想到使用路由跳转传参来传递参数,页面a通过route.query获取到页面b传递的参数来选择相应的select.
出现问题: 这个方法确实可以通过页面b的跳转来选择不同的select,但是由于query在地址栏传参的问题,导致页面a即是刷新了选中的仍然是在页面b选择的单位信息关联.正常情况下我刷新页面肯定是想看到默认打开的样子,而不是从其他页面跳转的样子,故此,此方法放弃

2.解决方法: params传参,原理同方法一相同,但是想到params不在地址栏显示,刷新相当于丢失,反而能造成刷新重置的效果.
出现问题: params根本就接受不到,通过route.params打印出来为{},由于我们的路由都是动态存在后端的 所以我也没有擅自去在路由地址里面拼接的形式实现params参数传递,而且这个不是必要的,页面a本身就是可以直接打开的不一定非要传params.所以此方法也不行.

3. 解决方法:pinia储存信息,在页面b跳转之前,要传递的信息存入pinia,在页面a里面读取到pinia的信息就选中关联,如果读不到就默认选中自己,由于pinna不做持久化处理,反而刷新页面就会丢失,默认选中就是自己的了,此方案暂时稳定,测试无bug.