Redux 中如何定义操作

在 Redux 中，操作（Actions）是用来描述应用中的某个事件被触发之后要进行的操作。操作本质上是一个普通的 JavaScript 对象，其中必须包含一个 type 属性来指定操作类型。操作还可以携带一些额外的数据，用来描述操作所需的信息。

定义操作

以下是在 Redux 中定义操作的示例：

// 定义一个增加计数的操作
const increment = () => {
  return {
    type: 'INCREMENT',
  }
}

// 定义一个减少计数的操作，并指定额外的数据
const decrement = (amount) => {
  return {
    type: 'DECREMENT',
    payload: amount,
  }
}

在上述示例中，increment 操作指定了类型为 'INCREMENT'，而 decrement 操作则指定了类型为 'DECREMENT'，并且还携带了一个 payload 属性来表示减少的数量。在实际应用中，操作的类型可以是任意的字符串，可以根据具体需求自行定义。

分发操作

定义操作只是一个步骤，要让操作生效，还需要将它们分发给 Redux 存储（Store）。为此，需要使用 Redux 提供的 dispatch 函数来分发操作。

// 导入 Redux 相关的函数
import { createStore } from 'redux'

// 创建 Redux 存储
const store = createStore(reducer)

// 分发操作至 Redux 存储
store.dispatch(increment())
store.dispatch(decrement(5))

在上述示例中，通过调用 store.dispatch 函数将操作分发给 Redux 存储。当操作被分发后，Redux 会通过事先定义好的 reducer 函数 处理操作，并对应更新应用的状态。

操作的处理

操作被分发后需要定义对应的 reducer 函数 来处理操作，并根据操作的类型更新应用的状态。

以下是处理上述操作的示例：

// 定义 reducer 函数
const reducer = (state = 0, action) => {
  switch (action.type) {
    case 'INCREMENT':
      return state + 1
    case 'DECREMENT':
      return state - action.payload
    default:
      return state
  }
}

在上述示例中，reducer 函数接收当前的状态（state）和操作（action）作为输入，并根据操作的类型来更新状态。当分发操作时，Redux 会自动调用 reducer 函数，并将当前的状态和操作传入，最终返回更新后的状态。

以上就是在 Redux 中定义操作的基本过程，通过定义操作、分发操作和处理操作在 Redux 中完成数据交互和状态管理。