window.open新开的标签页获取不到最新的redux数据

最近遇到一个小问题,在tab1标签页点击一个按钮,然后期望的效果是点击之后新开一个标签页,在该新的标签页里面可以查看对应的图片信息,图片信息是在前一个页面中获取到的。

对此我首要的解决方案就是使用redux,但是开发完发现在新开的标签页中读取到的store数据都是redux中的初始化store数据,前一个页面中store中更新的最新数据根本获取不到,后来查看资料后才知道,通过window.open打开的新标签页其获取的state和前一个页面的state是分离的,所以无论前一个页面如何保存数据,新开的标签页按照window.open这种方法是获取不到最新的store数据的。

对此我查找了一个资料,github提供的一种解决方案是使用Link,然后在link上使用store.getState()将当前整个页面的全部store数据传递给新开的标签页,但是我测试了这种方案没有走通,在新的标签页中获取到state是按照search参数来解析的,而不是按照我们传递的state数据来解析的。后来尝试将整个store数据通过JSON.stringify()转成字符串,放在search参数中,但是这样的话就会导致新开的标签页的search特别长,虽然可以解决问题但是不太好。

还有一种解决方案就是将前一个页面获取接口的参数全部传递过来,然后在这个页面重新获取一下接口,这样的话也可以解决这个问题。

我最后采取的方案是使用了本地缓存-good-storage这个库,将图片列表保存在本地缓存中,在新开的标签页中可以直接从sessionStorage中读取最新的数据,这样的话实现起来也是相对比较简单的。

你可能感兴趣的:(react,redux)