什么是 redux-loop 以及我们如何在 React Native 中使用它

Question

什么是 redux-loop，在 React Native 应用程序中使用它的主要目的是什么？

Answer 1

Redux Loop 是一个库，通过将 elm 架构移植到 redux，它可以让你运行以一种纯粹且可测试的方式从你的 reducer 中产生副作用。它的用途与 redux-thunk 和 redux-saga 相似。

这是一个示例，您可以在其中触发提取并描述如何处理成功和失败，所有这些都来自您的减速器。

//reducer.js
import { loop, Cmd } from 'redux-loop';

const initialState = {
  loading: false,
  data: null,
  error: null
}

function reducer(state = initialState, action){
  if(action.type === 'pageLoaded'){
    const newState = {...state, loading: true};
    const cmd = Cmd.run(fetchData, {
      successActionCreator: dataLoaded,
      failActionCreator: dataLoadFailed,
      args: [action.itemId]
    });
    return loop(newState, cmd);
  }
  else if(action.type === 'dataLoaded'){
    return {
      ...state,
      loading: false,
      data: action.data,
      error: null
    };
  }
  else if(action.type === 'dataLoadFailed'){
    return {
      loading: false,
      error: action.error
    };
  }
  return state;
}

export default reducer;

请注意，fetchData 从未真正从您的 reducer 中调用过，因此它仍然是一个纯函数，只有 returns 数据并且很容易测试。

出于与在带有 redux 的常规 React 应用程序中使用它的相同原因，您可以在 react-native 应用程序中使用 redux-loop，即 redux 本身不提供直接运行来自 redux 代码的副作用。相反，它允许您为 redux 编写中间件和存储增强器，即 redux-loop，从而让您自己决定如何做。

您可以在 https://redux-loop.js.org/

阅读更多内容

注：我维护redux-loop

什么是 redux-loop 以及我们如何在 React Native 中使用它

What is redux-loop and How can we use it in react native

redux

react-native-android

redux-loop