生态系统

¥Ecosystem

Redux 是一个很小的库，但它的合约和 API 都经过精心选择，以产生一个工具和扩展的生态系统，并且社区创建了各种有用的插件、库和工具。你不需要使用任何这些插件来使用 Redux，但它们可以帮助你更轻松地实现应用中的功能并解决问题。

¥Redux is a tiny library, but its contracts and APIs are carefully chosen to spawn an ecosystem of tools and extensions, and the community has created a wide variety of helpful addons, libraries, and tools. You don't need to use any of these addons to use Redux, but they can help make it easier to implement features and solve problems in your application.

有关 Redux 相关的库、插件和工具的广泛目录，请查看 Redux 生态系统链接列表。此外，React/Redux 链接列表还包含教程和其他有用的资源，供任何学习 React 或 Redux 的人使用。

¥For an extensive catalog of libraries, addons, and tools related to Redux, check out the Redux Ecosystem Links list. Also, the React/Redux Links list contains tutorials and other useful resources for anyone learning React or Redux.

本页面列出了一些 Redux 维护者亲自审查过的或已在社区中广泛采用的 Redux 相关插件。不要因此而阻止你尝试其他方法！生态系统发展太快，我们观察一切的时间有限。将这些视为“员工精选”，如果你使用 Redux 构建了一些精彩的东西，请毫不犹豫地提交 PR。

¥This page lists some of the Redux-related addons that the Redux maintainers have vetted personally, or that have shown widespread adoption in the community. Don't let this discourage you from trying the rest of them! The ecosystem is growing too fast, and we have a limited time to look at everything. Consider these the “staff picks”, and don't hesitate to submit a PR if you've built something wonderful with Redux.

库集成和绑定

¥Library Integration and Bindings

reduxjs/react-redux
Redux 的官方 React 绑定，由 Redux 团队维护

¥reduxjs/react-redux
The official React bindings for Redux, maintained by the Redux team

angular-redux/ng-redux
Redux 的 Angular 1 绑定

¥angular-redux/ng-redux
Angular 1 bindings for Redux

ember-redux/ember-redux
Redux 的 Ember 绑定

¥ember-redux/ember-redux
Ember bindings for Redux

glimmer-redux/glimmer-redux
Ember 的 Glimmer 组件引擎的 Redux 绑定

¥glimmer-redux/glimmer-redux
Redux bindings for Ember's Glimmer component engine

tur-nr/polymer-redux
Polymer 的 Redux 绑定

¥tur-nr/polymer-redux
Redux bindings for Polymer

lastmjs/redux-store-element 自定义元素的 Redux 绑定

¥lastmjs/redux-store-element Redux bindings for custom elements

Reducer

Reducer 组合

¥Reducer Combination

ryo33/combineSectionReducers
combineReducers 的扩展版本，它允许将 state 作为第三个参数传递给所有切片缩减器。

¥ryo33/combineSectionReducers
An expanded version of combineReducers, which allows passing state as a third argument to all slice reducers.

KodersLab/topologically-combine-reducers
combineReducers 变体，允许定义排序和数据传递的跨切片依赖

¥KodersLab/topologically-combine-reducers
A combineReducers variation that allows defining cross-slice dependencies for ordering and data passing

var masterReducer = topologicallyCombineReducers(
  { auth, users, todos },
  // define the dependency tree
  { auth: ['users'], todos: ['auth'] }
)

Reducer 组成

¥Reducer Composition

acdlite/reduce-reducers
提供同级 reducer 的顺序组合

¥acdlite/reduce-reducers
Provides sequential composition of reducers at the same level

const combinedReducer = combineReducers({ users, posts, comments })
const rootReducer = reduceReducers(combinedReducer, otherTopLevelFeatureReducer)

mhelmer/redux-xforms
可组合减速转换器集合

¥mhelmer/redux-xforms
A collection of composable reducer transformers

const createByFilter = (predicate, mapActionToKey) =>
  compose(
    withInitialState({}), // inject initial state as {}
    withFilter(predicate), // let through if action has filterName
    updateSlice(mapActionToKey), // update a single key in the state
    isolateSlice(mapActionToKey) // run the reducer on a single state slice
  )

adrienjt/redux 数据结构
常见数据结构的 Reducer 工厂函数：计数器、映射、列表（队列、堆栈）、集合

¥adrienjt/redux-data-structures
Reducer factory functions for common data structures: counters, maps, lists (queues, stacks), sets

const myCounter = counter({
  incrementActionTypes: ['INCREMENT'],
  decrementActionTypes: ['DECREMENT']
})

高阶 reducer

¥Higher-Order Reducers

omnidan/redux-undo
为你的 reducer 轻松撤消/重做和操作历史记录

¥omnidan/redux-undo
Effortless undo/redo and action history for your reducers

omnidan/redux-忽略
通过数组或过滤函数忽略 redux 操作

¥omnidan/redux-ignore
Ignore redux actions by array or filter function

omnidan/redux-recycle
重置某些操作的 redux 状态

¥omnidan/redux-recycle
Reset the redux state on certain actions

ForbesLindesay/redux-optimist
一个 reducer 增强器，用于启用与类型无关的乐观更新

¥ForbesLindesay/redux-optimist
A reducer enhancer to enable type-agnostic optimistic updates

实用工具

¥Utilities

reduxjs/重新选择
创建可组合的记忆选择器函数，以有效地从存储状态导出数据

¥reduxjs/reselect
Creates composable memoized selector functions for efficiently deriving data from the store state

const taxSelector = createSelector(
  [subtotalSelector, taxPercentSelector],
  (subtotal, taxPercent) => subtotal * (taxPercent / 100)
)

保罗姆斯特朗/正常化
根据模式规范化嵌套 JSON

¥paularmstrong/normalizr
Normalizes nested JSON according to a schema

const user = new schema.Entity('users')
const comment = new schema.Entity('comments', { commenter: user })
const article = new schema.Entity('articles', {
  author: user,
  comments: [comment]
})
const normalizedData = normalize(originalData, article)

Planttheidea/选择器
对常见选择器用例的 Reselect 的抽象

¥planttheidea/selectorator
Abstractions over Reselect for common selector use cases

const getBarBaz = createSelector(
  ['foo.bar', 'baz'],
  (bar, baz) => `${bar} ${baz}`
)
getBarBaz({ foo: { bar: 'a' }, baz: 'b' }) // "a b"

存储

¥Store

更改订阅

¥Change Subscriptions

jprichardson/redux-watch
根据关键路径或选择器监视状态变化

¥jprichardson/redux-watch
Watch for state changes based on key paths or selectors

let w = watch(() => mySelector(store.getState()))
store.subscribe(
  w((newVal, oldVal) => {
    console.log(newval, oldVal)
  })
)

asshaffer/redux-订阅
基于路径集中订阅状态变化

¥ashaffer/redux-subscribe
Centralized subscriptions to state changes based on paths

store.dispatch( subscribe("users.byId.abcd", "subscription1", () => {} );

批量

¥Batching

Tappleby/redux-batched-订阅
可以消除订阅通知的存储增强器

¥tappleby/redux-batched-subscribe
Store enhancer that can debounce subscription notifications

const debounceNotify = _.debounce(notify => notify())
const store = configureStore({
  reducer,
  enhancers: [batchedSubscribe(debounceNotify)]
})

manaflair/redux-batch
允许分派动作数组的存储增强器

¥manaflair/redux-batch
Store enhancer that allows dispatching arrays of actions

const store = configureStore({
  reducer,
  enhancers: existingEnhancersArray => [
    reduxBatch,
    ...existingEnhancersArray,
    reduxBatch
  ]
})
store.dispatch([{ type: 'INCREMENT' }, { type: 'INCREMENT' }])

laysent/redux-batch-actions-enhancer
接受批量操作的存储增强器

¥laysent/redux-batch-actions-enhancer
Store enhancer that accepts batched actions

const store = configureStore({ reducer, enhancers: [batch().enhancer] })
store.dispatch(createAction({ type: 'INCREMENT' }, { type: 'INCREMENT' }))

tshelburne/redux-batched-actions
处理批量操作的高阶 reducer

¥tshelburne/redux-batched-actions
Higher-order reducer that handles batched actions

const store = configureStore({ reducer: enableBatching(rootReducer) })
store.dispatch(batchActions([{ type: 'INCREMENT' }, { type: 'INCREMENT' }]))

坚持

¥Persistence

rt2zz/redux-持久
保留并补充 Redux 存储，并提供许多可扩展选项

¥rt2zz/redux-persist
Persist and rehydrate a Redux store, with many extensible options

const persistConfig = { key: 'root', version: 1, storage }
const persistedReducer = persistReducer(persistConfig, rootReducer)
export const store = configureStore({
  reducer: persistedReducer,
  middleware: getDefaultMiddleware =>
    getDefaultMiddleware({
      serializableCheck: {
        ignoredActions: [FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER]
      }
    })
})
export const persistor = persistStore(store)

react-stack/redux-storage
具有灵活后端的 Redux 持久层

¥react-stack/redux-storage
Persistence layer for Redux with flexible backends

const reducer = storage.reducer(combineReducers(reducers))
const engine = createEngineLocalStorage('my-save-key')
const storageMiddleware = storage.createMiddleware(engine)
const store = configureStore({
  reducer,
  middleware: getDefaultMiddleware =>
    getDefaultMiddleware.concat(storageMiddleware)
})

redux-offline/redux-offline
离线优先应用的持久存储，支持乐观的 UI

¥redux-offline/redux-offline
Persistent store for Offline-First apps, with support for optimistic UIs

const store = configureStore({ reducer, enhancer: [offline(offlineConfig)] })
store.dispatch({
  type: 'FOLLOW_USER_REQUEST',
  meta: { offline: { effect: {}, commit: {}, rollback: {} } }
})

不可变数据

¥Immutable Data

ImmerJS/沉浸式
使用代理，使用正常的可变代码进行不可变更新

¥ImmerJS/immer
Immutable updates with normal mutative code, using Proxies

const nextState = produce(baseState, draftState => {
  draftState.push({ todo: 'Tweet about it' })
  draftState[1].done = true
})

副作用

¥Side Effects

广泛使用

¥Widely Used

reduxjs/redux-thunk
调度函数，调用该函数并以 dispatch 和 getState 作为参数。这会成为 AJAX 调用和其他异步行为的漏洞。

¥reduxjs/redux-thunk
Dispatch functions, which are called and given dispatch and getState as parameters. This acts as a loophole for AJAX calls and other async behavior.

最适合：入门，简单的异步和复杂的同步逻辑。

¥Best for: getting started, simple async and complex synchronous logic.

function fetchData(someValue) {
    return (dispatch, getState) => {
        dispatch({type : "REQUEST_STARTED"});

        myAjaxLib.post("/someEndpoint", {data : someValue})
            .then(response => dispatch({type : "REQUEST_SUCCEEDED", payload : response})
            .catch(error => dispatch({type : "REQUEST_FAILED", error : error});
    };
}

function addTodosIfAllowed(todoText) {
    return (dispatch, getState) => {
        const state = getState();

        if(state.todos.length < MAX_TODOS) {
            dispatch({type : "ADD_TODO", text : todoText});
        }
    }
}

监听器中间件（Redux 工具包）
listenerMiddleware 旨在成为更广泛使用的 Redux 异步中间件（如 sagas 和 observables）的轻量级替代品。虽然在复杂性和概念上与 thunk 类似，但它可以用来复制一些常见的 saga 使用模式。

¥listenerMiddleware (Redux Toolkit)
listenerMiddleware is intended to be a lightweight alternative to more widely used Redux async middleware like sagas and observables. While similar to thunks in level of complexity and concept, it can be used to replicate some common saga usage patterns.

listenerMiddleware.startListening({
  matcher: isAnyOf(action1, action2, action3),
  effect: (action, listenerApi) => {
    const user = selectUserDetails(listenerApi.getState())

    const { specialData } = action.meta

    analyticsApi.trackUsage(action.type, user, specialData)
  }
})

redux-saga/redux-saga
使用看起来同步的生成器函数处理异步逻辑。Sagas 返回效果的描述，由 saga 中间件执行，对于 JS 应用来说就像 "后台线程" 一样。

¥redux-saga/redux-saga
Handle async logic using synchronous-looking generator functions. Sagas return descriptions of effects, which are executed by the saga middleware, and act like "background threads" for JS applications.

最适合：复杂的异步逻辑、解耦的工作流程

¥Best for: complex async logic, decoupled workflows

function* fetchData(action) {
  const { someValue } = action
  try {
    const response = yield call(myAjaxLib.post, '/someEndpoint', {
      data: someValue
    })
    yield put({ type: 'REQUEST_SUCCEEDED', payload: response })
  } catch (error) {
    yield put({ type: 'REQUEST_FAILED', error: error })
  }
}

function* addTodosIfAllowed(action) {
  const { todoText } = action
  const todos = yield select(state => state.todos)

  if (todos.length < MAX_TODOS) {
    yield put({ type: 'ADD_TODO', text: todoText })
  }
}

redux-observable/redux-observable

使用名为 "epics" 的 RxJS 可观察链处理异步逻辑。编写和取消异步操作会产生副作用等。

¥Handle async logic using RxJS observable chains called "epics". Compose and cancel async actions to create side effects and more.

最适合：复杂的异步逻辑、解耦的工作流程

¥Best for: complex async logic, decoupled workflows

const loginRequestEpic = action$ =>
  action$
    .ofType(LOGIN_REQUEST)
    .mergeMap(({ payload: { username, password } }) =>
      Observable.from(postLogin(username, password))
        .map(loginSuccess)
        .catch(loginFailure)
    )

const loginSuccessfulEpic = action$ =>
  action$
    .ofType(LOGIN_SUCCESS)
    .delay(2000)
    .mergeMap(({ payload: { msg } }) => showMessage(msg))

const rootEpic = combineEpics(loginRequestEpic, loginSuccessfulEpic)

redux-loop/redux-loop

Elm 架构到 Redux 的端口，允许你通过从 reducer 返回效果来自然而纯粹地对效果进行排序。reducer 现在返回状态值和副作用描述。

¥A port of the Elm Architecture to Redux that allows you to sequence your effects naturally and purely by returning them from your reducers. Reducers now return both a state value and a side effect description.

最适合：尝试在 Redux+JS 中尽可能像 Elm

¥Best for: trying to be as much like Elm as possible in Redux+JS

export const reducer = (state = {}, action) => {
  switch (action.type) {
    case ActionType.LOGIN_REQUEST:
      const { username, password } = action.payload
      return loop(
        { pending: true },
        Effect.promise(loginPromise, username, password)
      )
    case ActionType.LOGIN_SUCCESS:
      const { user, msg } = action.payload
      return loop(
        { pending: false, user },
        Effect.promise(delayMessagePromise, msg, 2000)
      )
    case ActionType.LOGIN_FAILURE:
      return { pending: false, err: action.payload }
    default:
      return state
  }
}

jeffbski/redux-logic

使用可观察量构建的副作用库，但允许使用回调、promise、异步/等待或可观察量。提供操作的声明性处理。

¥Side effects lib built with observables, but allows use of callbacks, promises, async/await, or observables. Provides declarative processing of actions.

最适合：非常解耦的异步逻辑

¥Best for: very decoupled async logic

const loginLogic = createLogic({
  type: Actions.LOGIN_REQUEST,

  process({ getState, action }, dispatch, done) {
    const { username, password } = action.payload

    postLogin(username, password)
      .then(
        ({ user, msg }) => {
          dispatch(loginSucceeded(user))

          setTimeout(() => dispatch(showMessage(msg)), 2000)
        },
        err => dispatch(loginFailure(err))
      )
      .then(done)
  }
})

Promise

acdlite/redux-promise
将 promise 作为操作有效负载进行调度，并在 promise 解决或拒绝时调度符合 FSA 的操作。

¥acdlite/redux-promise
Dispatch promises as action payloads, and have FSA-compliant actions dispatched as the promise resolves or rejects.

dispatch({ type: 'FETCH_DATA', payload: myAjaxLib.get('/data') })
// will dispatch either {type : "FETCH_DATA", payload : response} if resolved,
// or dispatch {type : "FETCH_DATA", payload : error, error : true} if rejected

lelandrichardson/redux-pack
明智的、声明性的、基于约定的 promise 处理，引导用户朝好的方向发展，而不暴露调度的全部能力。

¥lelandrichardson/redux-pack
Sensible, declarative, convention-based promise handling that guides users in a good direction without exposing the full power of dispatch.

dispatch({type : "FETCH_DATA", payload : myAjaxLib.get("/data") });

// in a reducer:
        case "FETCH_DATA": =
            return handle(state, action, {
                start: prevState => ({
                  ...prevState,
                  isLoading: true,
                  fooError: null
                }),
                finish: prevState => ({ ...prevState, isLoading: false }),
                failure: prevState => ({ ...prevState, fooError: payload }),
                success: prevState => ({ ...prevState, foo: payload }),
            });

中间件

¥Middleware

网络和套接字

¥Networks and Sockets

svrcekmichal/redux-axios-中间件
使用 Axios 获取数据并调度开始/成功/失败操作

¥svrcekmichal/redux-axios-middleware
Fetches data with Axios and dispatches start/success/fail actions

export const loadCategories() => ({ type: 'LOAD', payload: { request : { url: '/categories'} } });

agraboso/redux-api-中间件
读取 API 调用操作、获取和调度 FSA

¥agraboso/redux-api-middleware
Reads API call actions, fetches, and dispatches FSAs

const fetchUsers = () => ({
  [CALL_API]: {
    endpoint: 'http://www.example.com/api/users',
    method: 'GET',
    types: ['REQUEST', 'SUCCESS', 'FAILURE']
  }
})

itaylor/redux-socket.io
socket.io 和 redux 之间的固定连接器。

¥itaylor/redux-socket.io
An opinionated connector between socket.io and redux.

const store = configureStore({
  reducer,
  middleware: getDefaultMiddleware =>
    getDefaultMiddleware.concat(socketIoMiddleware)
})
store.dispatch({ type: 'server/hello', data: 'Hello!' })

tiberiuc/redux-react-firebase
Firebase、React 和 Redux 之间的集成

¥tiberiuc/redux-react-firebase
Integration between Firebase, React, and Redux

异步行为

¥Async Behavior

rt2zz/redux-action-buffer
将所有操作缓冲到队列中，直到满足断路器条件，此时队列被释放

¥rt2zz/redux-action-buffer
Buffers all actions into a queue until a breaker condition is met, at which point the queue is released

wyze/redux-去抖
符合 FSA 的中间件，用于 Redux 去抖动操作。

¥wyze/redux-debounce
FSA-compliant middleware for Redux to debounce actions.

mathieudutour/redux-queue-offline
离线时对操作进行排队，并在重新上线时分派它们。

¥mathieudutour/redux-queue-offline
Queue actions when offline and dispatch them when getting back online.

分析

¥Analytics

rangle/redux-beacon
与任何分析服务集成，可以离线跟踪，并将分析逻辑与应用逻辑分离

¥rangle/redux-beacon
Integrates with any analytics services, can track while offline, and decouples analytics logic from app logic

markdalgleish/redux-analytics
使用元分析值监视 Flux 标准操作并对其进行处理

¥markdalgleish/redux-analytics
Watches for Flux Standard Actions with meta analytics values and processes them

实体和集合

¥Entities and Collections

tommikaikkonen/redux-orm
一个简单的不可变 ORM，用于管理 Redux 存储中的关系数据。

¥tommikaikkonen/redux-orm
A simple immutable ORM to manage relational data in your Redux store.

Versent/redux-crud
CRUD 逻辑的基于约定的操作和归约器

¥Versent/redux-crud
Convention-based actions and reducers for CRUD logic

kwelch/entities-reducer
处理来自 Normalizr 的数据的高阶 reducer

¥kwelch/entities-reducer
A higher-order reducer that handles data from Normalizr

幅度/redux-查询
声明与组件的共置数据依赖，在组件安装时运行查询，执行乐观更新，并使用 Redux 操作触发服务器更改。

¥amplitude/redux-query
Declare colocated data dependencies with your components, run queries when components mount, perform optimistic updates, and trigger server changes with Redux actions.

cantierecreativo/redux-bees
声明式 JSON-API 交互，可规范化数据，并使用可运行查询的 React HOC

¥cantierecreativo/redux-bees
Declarative JSON-API interaction that normalizes data, with a React HOC that can run queries

GetAmbassador/redux-clerk
使用规范化、乐观更新、同步/异步操作创建器、选择器和可扩展缩减器进行异步 CRUD 处理。

¥GetAmbassador/redux-clerk
Async CRUD handling with normalization, optimistic updates, sync/async action creators, selectors, and an extendable reducer.

喊/redux-io
JSON-API 抽象，具有异步 CRUD、规范化、乐观更新、缓存、数据状态和错误处理。

¥shoutem/redux-io
JSON-API abstraction with async CRUD, normalization, optimistic updates, caching, data status, and error handling.

jmeas/redux 资源
一个微小但功能强大的管理 'resources' 的系统：持久保存到远程服务器的数据。

¥jmeas/redux-resource
A tiny but powerful system for managing 'resources': data that is persisted to remote servers.

组件状态和封装

¥Component State and Encapsulation

三点一/redux-react-local
Redux 中的本地组件状态，以及组件操作的处理

¥threepointone/redux-react-local
Local component state in Redux, with handling for component actions

@local({
  ident: 'counter', initial: 0, reducer : (state, action) => action.me ? state + 1 : state }
})
class Counter extends React.Component {

epeli/lean-redux
让 Redux 中的组件状态像 setState 一样简单

¥epeli/lean-redux
Makes component state in Redux as easy as setState

const DynamicCounters = connectLean(
    scope: "dynamicCounters",
    getInitialState() => ({counterCount : 1}),
    addCounter, removeCounter
)(CounterList);

DataDog/redux-doghouse
旨在通过将操作和化简器的范围限定到组件的特定实例，使可重用组件更容易使用 Redux 构建。

¥DataDog/redux-doghouse
Aims to make reusable components easier to build with Redux by scoping actions and reducers to a particular instance of a component.

const scopeableActions = new ScopedActionFactory(actionCreators)
const actionCreatorsScopedToA = scopeableActions.scope('a')
actionCreatorsScopedToA.foo('bar') //{ type: SET_FOO, value: 'bar', scopeID: 'a' }

const boundScopeableActions = bindScopedActionFactories(
  scopeableActions,
  store.dispatch
)
const scopedReducers = scopeReducers(reducers)

开发工具

¥Dev Tools

调试器和查看器

¥Debuggers and Viewers

reduxjs/redux-devtools

Dan Abramov 最初的 Redux DevTools 实现，专为应用内状态显示和时间旅行调试而构建

¥Dan Abramov's original Redux DevTools implementation, built for in-app display of state and time-travel debugging

zalmoxisus/redux-devtools-扩展

¥zalmoxisus/redux-devtools-extension

Mihail Diordiev 的浏览器扩展，它打包了多个状态监视器视图并添加了与浏览器自己的开发工具的集成

¥Mihail Diordiev's browser extension, which bundles multiple state monitor views and adds integration with the browser's own dev tools

无限红/反应加速器

¥infinitered/reactotron

一个跨平台 Electron 应用，用于检查 React 和 React Native 应用，包括应用状态、API 请求、性能、错误、传奇和操作调度。

¥A cross-platform Electron app for inspecting React and React Native apps, including app state, API requests, perf, errors, sagas, and action dispatching.

开发工具监视器

¥DevTools Monitors

日志监控
Redux DevTools 的默认监视器，具有树形视图

¥Log Monitor
The default monitor for Redux DevTools with a tree view

码头监视器
用于 Redux DevTools 监视器的可调整大小且可移动的底座

¥Dock Monitor
A resizable and movable dock for Redux DevTools monitors

滑块监视器
Redux DevTools 的自定义监视器，用于重放记录的 Redux 操作

¥Slider Monitor
A custom monitor for Redux DevTools to replay recorded Redux actions

差异监视器
Redux DevTools 的监视器，用于区分操作之间的 Redux 存储突变

¥Diff Monitor
A monitor for Redux DevTools that diffs the Redux store mutations between actions

可过滤日志监视器
Redux DevTools 的可过滤树视图监视器

¥Filterable Log Monitor
Filterable tree view monitor for Redux DevTools

过滤器操作
Redux DevTools 可组合监视器，具有过滤操作的能力

¥Filter Actions
Redux DevTools composable monitor with the ability to filter actions

记录

¥Logging

evgenyrodionov/redux-logger
显示操作、状态和差异的日志中间件

¥evgenyrodionov/redux-logger
Logging middleware that shows actions, states, and diffs

inakianduaga/redux-状态历史
增强器，提供时间旅行和高效的动作记录功能，包括动作日志的导入/导出和动作回放。

¥inakianduaga/redux-state-history
Enhancer that provides time-travel and efficient action recording capabilities, including import/export of action logs and action playback.

joshwcomeau/redux-vcr
实时记录和回放用户会话

¥joshwcomeau/redux-vcr
Record and replay user sessions in real-time

社交表/redux-未处理的操作
警告在开发过程中不会产生状态变化的操作

¥socialtables/redux-unhandled-action
Warns about actions that produced no state changes in development

突变检测

¥Mutation Detection

leoasis/redux-不可变-状态不变
当你尝试在调度内部或调度之间改变状态时，中间件会抛出错误。

¥leoasis/redux-immutable-state-invariant
Middleware that throws an error when you try to mutate your state either inside a dispatch or between dispatches.

flexport/mutation-sentinel
帮助你在运行时深入检测突变并强制代码库中的不可变性。

¥flexport/mutation-sentinel
Helps you deeply detect mutations at runtime and enforce immutability in your codebase.

mmahalwy/redux-pure-connect
检查并记录 react-redux 的 connect 方法是否传递了创建不纯 props 的 mapState 函数。

¥mmahalwy/redux-pure-connect
Check and log whether react-redux's connect method is passed mapState functions that create impure props.

测试

¥Testing

阿诺贝纳德/redux-mock-store
一个模拟存储，将分派的操作保存在数组中以用于断言

¥arnaudbenard/redux-mock-store
A mock store that saves dispatched actions in an array for assertions

可用/redux-测试带
扩展存储 API，使其更容易断言、隔离和操作存储

¥Workable/redux-test-belt
Extends the store API to make it easier assert, isolate, and manipulate the store

Conorhastings/redux-测试日志器
根据应用中的操作自动生成 reducer 测试的中间件

¥conorhastings/redux-test-recorder
Middleware to automatically generate reducers tests based on actions in the app

Wix/redux-测试套件
用于测试 Redux 项目的完整且固定的测试包（reducers、selectors、actions、thunk）

¥wix/redux-testkit
Complete and opinionated testkit for testing Redux projects (reducers, selectors, actions, thunks)

jfairbank/redux-saga-测试计划
使 sagas 的集成和单元测试变得轻而易举

¥jfairbank/redux-saga-test-plan
Makes integration and unit testing of sagas a breeze

路由

¥Routing

supasate/连接反应路由将 React Router v4+ 状态与你的 Redux 存储同步。

¥supasate/connected-react-router Synchronize React Router v4+ state with your Redux store.

faceyspacey/redux-first-router
无缝 Redux 优先路由。将你的应用视为状态，而不是路由，而不是组件，同时保持地址栏同步。一切都是状态。连接你的组件并只需发送 Flux 标准操作。

¥faceyspacey/redux-first-router
Seamless Redux-first routing. Think of your app in states, not routes, not components, while keeping the address bar in sync. Everything is state. Connect your components and just dispatch flux standard actions.

形式

¥Forms

erikras/redux-form
一个功能齐全的库，使 React HTML 表单能够将其状态存储在 Redux 中。

¥erikras/redux-form
A full-featured library to enable a React HTML form to store its state in Redux.

davidkpiano/react-redux-form
React Redux Form 是一个 reducer 创建者和 action 创建者的集合，使得使用 React 和 Redux 实现最复杂和自定义的表单变得简单且高效。

¥davidkpiano/react-redux-form
React Redux Form is a collection of reducer creators and action creators that make implementing even the most complex and custom forms with React and Redux simple and performant.

更高层次的抽象

¥Higher-Level Abstractions

凯伊斯
Redux、Redux-Saga 和 Reselect 的抽象。为你的应用的操作、reducer、选择器和传奇提供框架。它为 Redux 赋能，使其像 setState 一样简单易用。它减少了样板文件和冗余，同时保留了可组合性。

¥keajs/kea
An abstraction over Redux, Redux-Saga and Reselect. Provides a framework for your app’s actions, reducers, selectors and sagas. It empowers Redux, making it as simple to use as setState. It reduces boilerplate and redundancy, while retaining composability.

TheComfyChair/redux-scc
采用已定义的结构并使用 'behaviors' 创建一组操作、reducer 响应和选择器。

¥TheComfyChair/redux-scc
Takes a defined structure and uses 'behaviors' to create a set of actions, reducer responses and selectors.

Bloomca/redux-tiles
在 Redux 之上提供最小的抽象，以实现简单的可组合性、简单的异步请求和合理的可测试性。

¥Bloomca/redux-tiles
Provides minimal abstraction on top of Redux, to allow easy composability, easy async requests, and sane testability.

社区公约

¥Community Conventions

通量标准作用
Flux 动作对象的人性化标准

¥Flux Standard Action
A human-friendly standard for Flux action objects

规范化 reducer 组成
嵌套 reducer 组合的有态度的标准

¥Canonical Reducer Composition
An opinionated standard for nested reducer composition

动态Redux reducer 打包包
关于打包 reducer、动作类型和动作的提案

¥Ducks: Redux Reducer Bundles
A proposal for bundling reducers, action types and actions

生态系统

目录​

库集成和绑定​

Reducer​

Reducer 组合​

Reducer 组成​

高阶 reducer​

实用工具​

存储​

更改订阅​

批量​

坚持​

不可变数据​

副作用​

广泛使用​

Promise​

中间件​

网络和套接字​

异步行为​

分析​

实体和集合​

组件状态和封装​

开发工具​

调试器和查看器​

开发工具监视器​

记录​

突变检测​

测试​

路由​

形式​

更高层次的抽象​

社区公约​

目录