Question

Redux减压剂应该没有副作用。但是，如果某个操作应该触发在浏览器中下载文件的内容基于商店的状态呢？当然这应该算作副作用？是否会像以下一样好或者我应该寻找替代方法？

case 'SAVE_GRID': {
  const { json } = state
  fileDownload(json, 'data.json', 'application/json')
  return state
}

Answer 1

除非你有非常复杂的状态转换，否则实际的fileDownload应该在动作创建者中发生，而不是在reducer中发生。减速器应该负责合并/减少状态，这就是全部。

动作：

export const saveGrid = (json) => {
   return (dispatch) => {  
       fileDownload(json, 'data.json', 'application/json')
           .then(() => {
              dispatch({ type: 'SAVE_GRID', json });
           });
   }
}

减速器：

case 'SAVE_GRID': {
    return {
        ...state,
        json: action.json
    }
}

Answer 2

有图书馆来处理这样的＆＃34; side＆＃34;的效果。

例如：

redux-observables ：他们在引擎盖下使用RX observable。

https://redux-observable.js.org/docs/basics/Epics.html

的终极版-佐贺

https://redux-saga.js.org/

Answer 3

还原器可以驱动效果，实际上，它们始终通过触发UI渲染的状态更改来做到这一点-可以说是应用程序最重要的效果。

驱动非视觉效果并不常见，但是至少有两种解决方案：redux-loop和redux-agent（我写过）。

在各个站点中：

redux-loop：

Elm Architecture到Redux的端口，允许您通过从减速器返回效果来自然而纯粹地对效果进行排序。 https://redux-loop.js.org/

redux-agent：

Redux Agent将React的模型扩展到非可视I / O：描述一个网络请求，一个存储操作，一个Websocket消息……并使机器担心执行它。逻辑保持在reducer中，组件保持轻量级，并且很容易看出是什么状态触发了哪种效果。 https://redux-agent.org/

（引号还暗示了两者之间的主要区别：redux循环从减速器返回效果描述，从而更改其API并需要商店增强器。redux-agent与香草Redux API一起使用。）

Answer 4

我使用钩子 useReducer 代替 redux。我不喜欢在动作创建者中放置副作用 - 那么不清楚动作创建者的目的是什么：构建动作还是运行副作用？

我在这里找到了一个可以满足我的目的的图书馆：

https://github.com/Jibbedi/use-reducer-effect

Redux减速机的副作用

4 个答案: