使用 react-redux 未将商品添加到购物车中

Question

我想使用 redux 将项目添加到购物车，它没有被添加，也没有显示任何错误。 请帮帮我。 下面是我的代码

这是cartItem.js

export const ADD_TO_CART = 'ADD_TO_CART'
export const REMOVE_FROM_CART = 'REMOVE_FROM_CART'


const initialState = []

const cartItemsReducer = (state = initialState, action) => {
  switch (action.type) {
    case ADD_TO_CART:
      return [...state, action.payload]
    case REMOVE_FROM_CART:
      return state.filter(cartItem => cartItem.id !== action.payload.id)
  }
  return state
}

export default cartItemsReducer

这是 store.js

import { createStore } from 'redux'
import cartItemsReducer from './CartItem'

const store = createStore(cartItemsReducer)

export default store

这是 App.js

import React from 'react'
import MainStackNavigator from './src/navigation/AppNavigator'
import { Provider as StoreProvider } from 'react-redux'
import store from './src/redux/Store'

export default function App() {
  
  return (
    <StoreProvider store={store}>
      <MainStackNavigator />
    </StoreProvider>
  )
}

这是我正在调度的屏幕

import  ADD_TO_CART from '../redux/CartItem'
import { useDispatch } from 'react-redux'

const dispatch = useDispatch()
    
const addItemToCart = item => dispatch({ type: ADD_TO_CART, payload: item })

<TouchableOpacity onPress={() => addItemToCart(item)} style={styles.button}>
                                    
<Text style={styles.buttonText}>Add +</Text>
                                
</TouchableOpacity>

Answer 1

您正在使用item参数调用该函数，但它来自哪里？

您必须定义参数，然后传递它。

<TouchableOpacity onPress={(item) => addItemToCart(item)} style=
{styles.button}>