2

我正在重构我的 NgRx 减速器以使用该createReducer()函数而不是传统的 switch 语句，但我收到以下错误：

ERROR in src/app/store/price.reducer.ts(17,32): error TS2339: Property 'action' does not exist on type 'IUser & TypedAction<"[Websocket Service] Get User"> & { type: "[Websocket Service] Get User"; }'.
    src/app/store/price.reducer.ts(18,34): error TS2339: Property 'action' does not exist on type 'IPrice & TypedAction<"[Websocket Service] New Prices"> & { type: "[Websocket Service] New Prices"; }'.

这是我的createReducer()函数和导出的减速器本身：

const userPriceReducer = createReducer(
  defaultState,
  on(actions.getUser, (state, {action}) => ({ ...state, user: { firstName: <string>action.firstName, lastName: <string>action.lastName, age: <number>action.age } })),
  on(actions.newPrices, (state, {action}) => ({ ...state, prices: { ...state.prices, ...{[action.product_id]: <number>action.price } } }))
)

export function reducer(state: State | undefined, action: Action) {
  return userPriceReducer(state, action);
}

这是我的行动：

export const NEW_PRICES = '[Websocket Service] New Prices';
export const GET_USER = '[Websocket Service] Get User';

export const newPrices = createAction(
  NEW_PRICES,
  props<IPrice>()
);

export const getUser = createAction(
  GET_USER,
  props<IUser>()
);

IPrice并且IUser是描述动作数据形状的接口。

我读过的关于这个的文档说，函数（我放的地方）后面state的花括号内的第二个参数应该是动作的有效负载，但是因为我正在使用我的动作，所以不像过去那样在动作中具有实际属性，并且动作本身携带数据。使用 switch 语句方法时，我可以毫无问题地访问和保存这些数据。我在这里做错了什么？createReducer(){action}createAction()payload

4

1 回答 1

4

您的操作没有操作属性，它应该是

const userPriceReducer = createReducer(
  defaultState,
  on(actions.getUser, (state, action) => ({ ...state, user: { firstName: <string>action.firstName, lastName: <string>action.lastName, age: <number>action.age } })),
  on(actions.newPrices, (state, action) => ({ ...state, prices: { ...state.prices, ...{[action.product_id]: <number>action.price } } }))
)

或者：

const userPriceReducer = createReducer(
  defaultState,
  on(actions.getUser, (state, {firstName,lastName,age}) => ({ ...state, user: { firstName: <string>firstName, lastName: <string>lastName, age: <number>age } })),
  on(actions.newPrices, (state, {price}) => ({ ...state, prices: { ...state.prices, ...{[action.product_id]: <number>price } } }))
)
于 2019-09-05T10:18:16.680 回答