从redux-observable epic

时间:2016-12-01 15:45:12

标签: javascript reactjs redux rxjs redux-observable

我正在使用redux来建立一个小小的fusball-manager。基本上它是一个页面,显示两个团队的分数和一些增加它们的按钮。我有像{ type:"GOAL_UP", team:"red" }这样的动作,减速器将改变状态中的相应值(分数)。

现在我想添加一个史诗,每当遇到GOAL_UP检查时,两支球队中的一支是否赢了比赛。如果一个团队得分为8,我希望它发送一个GAME_WON行动。我的问题是我必须访问该州以了解每个团队的得分。我找不到从史诗中获取状态的方法。

是否正在访问redux-observable范围之外的状态?如果是这样,你会如何解决这个问题?

我正在考虑将新分数作为GOAL_UP行动中的属性。这样的事情{ type:"GOAL_UP", team:"red", newScore:8 }。但不知怎的,这感觉不对。我还在fusball-table上有两个与web套接字相连的物理按钮,它们分发GOAL_UP动作。由于他们不是从我的ui触发他们不了解州。

如果任一团队的得分为8,我还可以考虑在我的ui组件的渲染功能中调度GAME_WON动作。但这感觉更加错误:)

非常欢迎输入,谢谢

1 个答案:

答案 0 :(得分:10)

查看redux-observable文档的Accessing the Store's State部分。

它描述了如何为您的史诗提供精简版商店,以便您可以致电store.getState()

请注意,当某个动作到达您的史诗时,已经通过您的缩减器运行(并且任何状态都已更新)。

const INCREMENT = 'INCREMENT';
const INCREMENT_IF_ODD = 'INCREMENT_IF_ODD';

const increment = () => ({ type: INCREMENT });
const incrementIfOdd = () => ({ type: INCREMENT_IF_ODD });

const incrementIfOddEpic = (action$, store) =>
  action$.ofType(INCREMENT_IF_ODD)
    .filter(() => store.getState().counter % 2 === 0)
    .map(increment);

// later...
dispatch(incrementIfOdd());

我还要补充一点,如上所述,我认为你不需要redux-observable甚至还不需要还原剂 - 它相当矫枉过正。当然,如果只是为了让你的脚湿透了,一定要学习!只是不要让你认为需要这些复杂的抽象用于简单的事情。