Question

我有2个互斥视图，它们都依赖于某些state。

当事件发生时，我需要通过推送新路线，使用react-router-redux从 View1 切换到 View2 。我还需要将state更新为 View2 数据所需，例如：

push('route-to-view2');
store.dispatch({type: 'state-for-view-2-received', payload: 'state-for-
view-2'});

问题是这两个更新不是原子地发生的。因此，在推送路线之后有一段时间，但是在 View2 显示没有状态（或我的情况下显示错误）之前调度状态之前。

如果我更改顺序如下：

store.dispatch({type: 'state-for-view-2-received', payload: 'state-for-view-2'});
push('route-to-view2');

出现同样的问题，因为 View1 不适用于 View2 的状态。

因此，在两种情况下，导航发生时都会出现小的闪烁。

有没有办法避免这个问题。

Answer 1

您可以使用react-batch-enhancer。它将批量操作并触发商店的通知，以便仅在reducer处理所有操作时作出反应。

import { batchActions } from 'redux-batch-enhancer';

dispatch(batchActions([
  store.dispatch({type: 'state-for-view-2-received', payload: 'state-for-view-2'}),
  push('route-to-view2');
]));

使用React Router Redux

1 个答案: