reactjs - PayloadAction 的 typescript 类型

Question

我正在使用 createSlice像这样:

import { createSlice, PayloadAction } from '@reduxjs/toolkit';

const initialState = {} as Order;

const order = createSlice({
  name: 'order',
  initialState,
  reducers: {
    setOrder: (_state, { payload }: PayloadAction<Order | null>) => payload,
  },
});

我收到以下错误:

Type 'SalesOrder | null' is not assignable to type 'void | SalesOrder | WritableDraft<SalesOrder>'.
  Type 'null' is not assignable to type 'void | SalesOrder | WritableDraft<SalesOrder>'.ts(2322)

当我将鼠标悬停在函数上时，我得到以下类型:

function(_state: WritableDraft<SalesOrder>, { payload }: PayloadAction<SalesOrder | null>): SalesOrder | null

我该如何解决？我希望值是 Order或 null .

Answer 1

我认为您实际上应该设置初始状态的值，而不是将空对象断言为 Order 类型。 .在这里我只是添加了随机属性，因为您没有包含类型 Order (只需将其更改为实际值)。除此之外，我设置了 initialState要么是类型 Order或 null .

type InitialOrderState = { Order | null };

const initialState: InitialOrderState = {
    orderId: "",
    status: "",
};

const order = createSlice({
  name: 'order',
  initialState,
  reducers: {
    setOrder: (state, { payload }: PayloadAction<InitialOrderState>) => payload,
  },
});