问题如何取消/忽略redux中的操作

有没有办法取消行动或忽略它？

或者更确切地说，忽略行动的最佳/推荐方法是什么？

我有以下动作创建者，当我输入无效大小时（比如说） 'some_string'）进入动作创建者，除了得到我自己的警告信息，我还得到： Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.

import { SET_SELECTED_PHOTOS_SIZE } from './_reducers';

export default (size=0) => {
  if (!isNaN(parseFloat(size))) {
    return {
      type: SET_SELECTED_PHOTOS_SIZE,
      size: size,
    };
  } else {
    app.warn('Size is not defined or not a number');
  }
};

我已经在讨论过了 reduxDiscord中的-channel（reactiflux），其中一个建议是使用redux-thunk，如下所示：

export default size => dispatch => {
  if (!isNaN(parseFloat(size))) {
    dispatch({
      type: SET_SELECTED_PHOTOS_SIZE,
      size: size,
    });
  } else {
    app.warn('Size is not defined or not a number');
  }
}

另一种选择是忽略reducer中的动作。这确实使reducer“更胖”，因为它有更多的职责，但它使用更少的thunk-actions，这使得它更容易调试。我可以看到thunk-pattern失控，因为我几乎每次都会被迫使用它，如果你拥有很多这些动作，那么批量操作会有点难以维持。

5937

2017-12-09 17:03

起源

答案:

忽略Action Creators中的操作基本上是将它们视为命令处理程序，而不是事件创建程序。当用户点击按钮时，它是某种事件。

所以基本上有两种方法可以解决这个问题：

条件是行动创造者和 thunk-middleware 用来

const cancelEdit = () => (dispatch, getState) => {
  if (!getState().isSaving) {
    dispatch({type: CANCEL_EDIT});
  }
}

条件在reducer内部，不需要中间件

function reducer(appState, action) {
  switch(action.type) {
   case: CANCEL_EDIT:
     if (!appState.isSaving) {
       return {...appState, editingRecord: null }
     } else {
       return appState;
     }
   default:
     return appState;

  }
}

我更倾向于将UI交互视为事件而不是命令，并且有两个优点：

您的所有域逻辑都保留在同步纯缩减器中，这非常容易测试。想象一下，你需要为功能编写单元测试。

const state = {
  isSaving: true,
  editingRecord: 'FOO'
};

// State is not changed because Saving is in progress
assert.deepEqual(
  reducer(state, {type: 'CANCEL_EDIT'}),
  state
);

// State has been changed because Saving is not in progress anymore
assert.deepEqual(
  reducer({...state, isSaving: false}),
  {isSaving: false, editingRecord: null}
);

正如您所看到的，测试非常简单，当您将交互视为事件时

如果您决定不是忽略该动作，而是愿意显示某些动作不可行的视觉指示，该怎么办？您需要发送另一个操作或基本上重建它。但是，您不能在此处使用热重载和重放，因为动作创建器中的逻辑不可重新播放。如果逻辑在reducer中，你可以简单地改变行为，reducer将被热重载并且所有事件都被重放。您发送的唯一事件是用户单击某个按钮，您不能否认这一事实。因此，除非您彻底更改UI，否则您始终可以通过重播进行热重新加载。

当您考虑与UI作为事件的任何交互时，您将获得最佳的重播体验，因为事件不能被拒绝他们刚刚发生。

2017-12-09 17:13

关于热重新加载方面，如果您重播reducer收到的操作，那么您应该以相同的方式结束，如果在创建者中触发了其他操作，那么重放这些操作仍然会导致相同的状态，假设减速器是纯净的 - qwertymk

这是事实，但正如我在上面的例子中解释的那样。在第一种方法（使用thunk-middleware）中，甚至没有调度操作，因此信息丢失，信息是用户单击按钮。这是一个简单的例子，但在现实世界中，你可能最终会在动作创建器中产生非常重的逻辑，导致许多动作（事件），但是生成动作的逻辑无论如何都不可重放。但是，无法拒绝某些UI交互的事实（单击按钮）。 - Tomáš Weiss

要忽略redux中的操作，您应该看看终极版，忽视。它是由阿布拉莫夫本人推荐的。 - umphy

答案: