redux 中的 action、reducer 和 store 有什么区别？

Question

我是 react/redux 的新手。我试图弄清楚 redux 中的所有部分是如何相互作用的。给我带来麻烦的一件事是理解动作和 reducers,store 之间的关系。

Answer 1

店铺保存应用程序状态数据的对象

减速器 returns 一些状态数据的函数。由操作触发 type

动作告诉减速器如何更改状态的对象。它必须包含 type 属性。它可以选择包含 payload 属性

Answer 2

想象一下您希望基于 class 的组件彼此共享数据的情况。他们甚至可能会更改数据。一个人可以以道具的形式向其他人提供数据。但是很难跟踪道具的名称和数据的结构。

商店实际上简化了这些东西。您设置应用程序架构的方式使组件将从供应中获取数据，即所谓的 Store。实际上，该机制非常智能，组件将在数据更改时重新呈现，因为组件都是耳朵。

和操作只不过是从您的应用程序到商店的数据载体。

并且很难清楚地表达减速器的概念。您可以想象一个真实的商店，其中放置不同的东西以备将来使用。杂乱无章地放东西，商店就没有用了。人们可能会在里面呆上几个小时，但可能什么也找不到。简单来说，Reducers 管理操作提供的数据在存储中的保存方式。

Answer 3

商店 -> 全球化状态
操作 -> 你想做什么，例如：事件点击
Reducer -> 描述你的动作如何将状态转移到下一个状态。它检查发生了哪些操作，并根据它更新商店的操作。
Dispatch -> 我们执行操作的方式。例如：将 action 分派给 reducer。然后 reducer 将检查要做什么并更新商店。

Answer 4

actions、reducers 和 stores 是 redux 的三个组成部分。

操作：操作是商店的唯一信息来源。操作有一个类型字段，它告诉要执行什么样的操作，所有其他字段都包含信息或数据。还有另一个术语叫做 Action Creators，这些是创建动作的函数。所以动作是信息（对象），动作创建者是 return 这些动作的函数。

Reducers：我们已经知道，action 只告诉做什么，但不告诉怎么做，所以 reducers 是获取当前状态的纯函数和操作以及 return 新状态并告诉商店该怎么做。

Store：store 是保存应用程序状态的对象。

我发现这个 link 特别有用 - https://www.geeksforgeeks.org/introduction-to-redux-action-reducers-and-store/

Answer 5

想想就很简单了:

Store - 保存您的应用程序使用的所有数据。
Reducer - 是在收到操作时操作该数据的东西。
Action - 告诉 reducer 操作存储数据，它带有名称和（不需要）一些数据。

Reducer通常是switch语句的格式，在所有可能的Actions（Cases）之间切换，然后操作根据操作存储数据。当 redux 中的 reducer 数据发生变化时，组件中的属性也会发生变化，然后会发生重新渲染。

Answer 6

根据redux documents：

store: 你的应用程序的整个全局状态都存储在一个名为 store 的对象中。
dispatcher: 要改变状态中的某些东西，你需要调度一个动作。（这就是调度员所做的）
action: 一个动作是一个简单的 JavaScript 对象，它描述了对 store 和该更改所需的相关负载。
reducer: 将状态和动作联系在一起，我们写了一个函数称为减速器。它只是一个（纯）函数，它将状态和动作作为参数，returns 应用程序的下一个状态。

如需更深入的了解，请查看 this link 中的图表。

Answer 7

Actions：Actions 是一个包含信息的普通 JavaScript 对象。操作是商店的唯一信息来源。 Actions 有一个 type 字段，它告诉要执行什么样的操作，所有其他字段都包含信息或数据。

示例：

function addTask(task) {
   
  return {
     
    type: 'ADD_TODO',
    task: task
  }
}

Reducers：我们已经知道，action 只告诉做什么，但不告诉怎么做，所以 reducers 是获取当前状态的纯函数和操作以及 return 新状态并告诉商店该怎么做。

示例：

function task(tasks = [], action) {
   
  if (action.type === 'ADD_TODO') {
    return [...tasks, action.task];
  } else if (action.type === 'REMOVE_TODO') {
      return tasks.filter(task => task !== action.task);
    }
  return tasks;
}

Store：store 是保存应用程序状态的对象。

参考：https://www.geeksforgeeks.org/introduction-to-redux-action-reducers-and-store/

redux 中的 action、reducer 和 store 有什么区别？

What is a difference between action,reducer and store in redux?

react-native

redux

redux-thunk

react-redux

redux-actions