Определение типа для текста состояния и действия

#reactjs #typescript #context-api

Вопрос:

Я использую состояние и действие в файле машинописного текста, который выглядит следующим образом:

 export const CartReducer = (state, action) => {
     switch (action.type) {
         case "ADD_ITEM":
             if (!state.cartItems.find(item => item.id === action.payload.id)) {
                 state.cartItems.push({
                     ...action.payload,
                     quantity: 1
                 })
             } 
 
             return {
                 ...state,
                 ...sumItems(state.cartItems),
                 cartItems: [...state.cartItems]
             }
         case "REMOVE_ITEM":
             return {
                 ...state,
                 ...sumItems(state.cartItems.filter(item => item.id !== action.payload.id)),
                 cartItems: [...state.cartItems.filter(item => item.id !== action.payload.id)]
             }
         case "INCREASE":
             state.cartItems[state.cartItems.findIndex(item => item.id === action.payload.id)].quantity  
             return {
                 ...state,
                 ...sumItems(state.cartItems),
                 cartItems: [...state.cartItems]
             }
         case "DECREASE":
             state.cartItems[state.cartItems.findIndex(item => item.id === action.payload.id)].quantity--
             return {
                 ...state,
                 ...sumItems(state.cartItems),
                 cartItems: [...state.cartItems]
             }
         case "CLEAR":
                 return {
                     cartItems: [],
                     ...sumItems([]),
                 }
         default:
             return state
 
     }
 }
 

Я получаю следующую ошибку:

 src/contexts/CartReducer.tsx:28:30
TS7006: Parameter 'state' implicitly has an 'any' type.
    26 |  }
 

Я не уверен в том, как определить тип для состояния и действия, хотя я объявил типы для других элементов, я не то же самое для состояния и действия.

я пытаюсь следовать этому для проекта машинописи.

Ответ №1:

Я считаю, что вам нужно определить начальное состояние

 initialState = {
cartItems:[]
}

export const CartReducer = (state=initialState , action) => {
 switch (action.type) {
 

Ответ №2:

Вы следуете проекту только для JS, попробуйте следовать проекту машинописного текста.

 interface MyState {
  readonly cartItems: readonly any[];
  ...
}
type Reducer<T> = (currentState: T, action: { type: string, payload: any })

export const CartReducer: Reducer<MyState> = (state, action) => { ... }
 

Попробуйте поискать типы для редуктора/действия для реакции. Лучше, чем изобретать велосипед заново.