Redux 是一个用于管理 JavaScript 应用程序状态的库。它通过中央存储来维护所有组件的状态，使得状态管理更加可预测和可维护。

安装 Redux

首先，你需要安装 Redux 库。你可以使用 npm 或 yarn 来安装它。

npm install redux
# 或者
yarn add redux

Redux 的基本概念

Action

Action 是一个对象，用于描述发生了什么。它通常包含一个 type 属性和一个可选的 payload 属性。

const ADD_TODO = 'ADD_TODO';

const addTodo = text => ({
  type: ADD_TODO,
  payload: text
});

Reducer

Reducer 是一个函数，它接收当前的 state 和一个 action，然后返回一个新的 state。

const todos = (state = [], action) => {
  switch (action.type) {
    case ADD_TODO:
      return [...state, action.payload];
    default:
      return state;
  }
};

Store

Store 是 Redux 的核心，它负责保存 state，并提供 getState、dispatch 和 subscribe 等方法。

import { createStore } from 'redux';

const store = createStore(todos);

Redux 的使用

你可以使用 store.dispatch 来触发 action，然后 reducer 会根据 action 更新 state。

store.dispatch(addTodo('Learn Redux'));

学习资源

更多关于 Redux 的信息，请访问我们的 Redux 教程。

图片

Redux 的核心概念之一是“不可变数据流”。下面是一个展示不可变数据流的图片：

Immutability Flow