预期 0 个参数，但得到 1 个。使用 Redux 工具包答案

【问题标题】：Expected 0 arguments, but got 1. with Redux toolkit预期 0 个参数，但得到 1 个。使用 Redux 工具包
【发布时间】：2021-06-20 00:03:58
【问题描述】：

我目前正在尝试使用 redux/toolkit 构建一个简单的 redux 示例。我不确定我做错了什么。

这是我的商店。

import { configureStore } from "@reduxjs/toolkit";
import reducer from "./workouts";

export default function () {
  return configureStore({ reducer });
}

这是我的锻炼.ts 文件

import { createAction } from '@reduxjs/toolkit'

export interface IWorkout {
  id: number
  restTime: number
  workoutTime: number
  exercises: number[]
  numReps: number
}

export interface IState {
  workouts: IWorkout[]
}

export interface IAction {
  type: string
  payload: IWorkout[] | any
}

export const workoutAdded = createAction('workoutAdded')
export const workoutDeleted = createAction('workoutDeleted')

const defaultState: IState = {
  workouts: [],
}

let lastId = 0

const reducer = (state: IState = defaultState, action: IAction): IState => {
  switch (action.type) {
    case workoutAdded.type:
      return {
        ...state,
        workouts: [
          ...state.workouts,
          {
            id: ++lastId,
            restTime: action.payload.restTime,
            workoutTime: action.payload.workoutTime,
            exercises: action.payload.exercises,
            numReps: action.payload.numReps,
          },
        ],
      }
    case workoutDeleted.type:
      return {
        ...state,
        workouts: state.workouts.filter((workout) => workout.id !== action.payload.id),
      }
    default:
      return state
  }
}

export default reducer

这是我的 index.ts 文件

import { render } from "react-dom";
import configureStore from "./store/store";
import { workoutAdded } from "./store/workouts";
import App from "./App";

const store = configureStore();

const newWorkout = {
  restTime: 10,
  workoutTime: 30,
  exercises: [1, 2, 3],
  NumReps: 6
};

store.dispatch(workoutAdded(newWorkout));

const rootElement = document.getElementById("root");
render(<App />, rootElement);

我的错误出现在 index.ts 文件中的这一行：

store.dispatch(workoutAdded(newWorkout));

不知道我错过了什么。我在这个sandbox中重现了错误

这是我在控制台中遇到的错误：

【问题讨论】：

标签： redux redux-toolkit

【解决方案1】：

workoutAdded有0个参数，如果要添加参数，可以实现Action

export class workoutAdded implements Action {
  readonly type = "workoutAdded"
  constructor(public payload: Workout){}
}

【讨论】：

我想在 index.ts 文件中调度动作时添加参数
我刚刚更改了答案，现在可以按预期工作吗？

【解决方案2】：

这解决了问题。 createAction 可以接收一个回调函数作为第二个参数，该函数返回一个带有有效负载的对象。

export const workoutAdded = createAction("workoutAdded", (workout) =>{
    return { payload: workout }; 
});

【讨论】：