react-redux

React-Redux是一个用于在React应用中管理状态的第三方库。

它是基于Redux架构的，通过将Redux的核心概念和React组件相结合，提供一种在React应用中高效管理状态的方式。

React-Redux为React应用的状态管理提供了一种优雅的解决方案。

React-Redux

在使用React-Redux时，通常会将组件的state抽离到一个全局的store进行管理。

这个store包含了应用的所有状态以及处理这种状态变化的方法。

import React from 'react';
import { createStore } from 'redux';
import { Provider } from 'react-redux';
import Reducers from './reducers';
import App from './App';

function AppContainer() {
  const store = createStore(Reducers);

  return (
    <Provider store={store}>
      <App />
    </Provider>
  );
}

export default AppContainer;

在这段代码中，首先引入了必要的库和组件：

createStore 是 Redux 提供的用于创建全局状态管理器的函数。
Provider 是 React Redux 提供的高阶组件，用于将 Redux 的状态管理器（store）注入整个应用中。

然后，定义了 AppContainer 函数组件。在组件内部，调用 createStore 并传入 Reducers（一个包含应用中所有 reducer 的对象）来创建 Redux 的状态管理器。将创建的状态管理器通过 Provider 组件的 store 属性提供给应用程序。

最后，将 App 组件作为 Provider 组件的子组件，使整个应用程序都能访问到 Redux 的状态管理器。

通过这样的组织结构，AppContainer 组件可以被作为应用的入口点，并确保整个应用都能够使用 Redux 提供的状态管理功能。

在 Redux 中，createStore 是用于创建一个全局的状态管理器（store）的函数。它接受一个或多个 reducer 函数作为参数，并返回一个 Redux store 对象。

store 对象具有以下主要功能和作用：

存储应用程序的状态：store 对象中存储了应用程序的整个状态树。这个状态树是通过传递给 createStore 的 reducer 函数来定义的。每个 reducer 函数都负责管理状态树的一个分支或一部分。
提供状态访问方法：store 对象提供了用于访问应用程序状态的方法，例如 getState()。通过调用 store.getState() 方法，你可以获取当前的状态树，从而在应用中获取所需的数据。
分发 action：通过调用 store.dispatch(action) 方法，可以向 Redux store 分发（dispatch）一个 action。Action 是一个普通的 JavaScript 对象，用于描述发生的事件或用户的操作。分发 action 后，Redux store 将会调用相应的 reducer 函数，更新状态树。
监听状态变化：通过调用 store.subscribe(listener) 方法，可以注册一个监听器，用于在状态变化时执行特定的逻辑。当状态发生变化时，Redux store 会调用这个监听器，你可以在其中执行一些额外的操作，例如更新用户界面。

通过 createStore 创建的 store 对象是 Redux 中非常重要的核心概念。它提供了一个统一的数据存储和管理机制，使得应用程序的状态管理更加可控和可预测。