有个场景:
有两个列表页,使用 react router 分别映射为:/list1, /list2 。列表数据都是使用 redux state 的 dataList 字段。
有一个用户点了列表页 /list1 ,这时候会调用 action creator 发出一个 action (异步 action,使用 redux thunk middleware 或者 redux-api-middleware )。因为网络等原因导致接口请求数据很慢,于是用户等不及就通过导航条转到 /list2 界面去了,而且 list2 的数据也成功获取(然而因为是 spa ,/list1 的请求还在 pending 中),当原来的 /list1 请求的数据返回时,/list1 和 /list2 的数据都是 storeState.dataList ,因此会把 list2 的数据覆盖掉。
对于这种情况有没有什么好的解决方法?能在切换路由跳转的时候,丢弃掉不必要的 action ?
有一种解决方式是不同的页面在storestate中使用不同的命名空间,但是这样的话会有个问题就是页面跳转多次以后,内存里可能会有许多页面的state数据,可能会导致不必要的内存占用问题
1
broadliyn OP 想到一个解决方法,请求服务器数据前是给每个 state 对象加一个 timestamp ,数据返回需要 dispatch 一个 action 通知 reducer 更新数据的时候,先去判断时间戳是不是等于之前指定的,如果相等,则发送一个 action ,如果不是,则不做任何操作
|
2
skyitachi 2016-08-23 14:13:43 +08:00
最简单的就是加个 timestamp 比对,其实可以加入一个数组,比如叫 pending_queue, 每次请求前塞入一个 timestamp ,请求结束后根据 action data 里的 timestamp 来做策略,因为队列的顺序代表着请求顺序,所以你可以根据需要来获取想要的顺序
|