Reactjs 将嵌套数组项添加到Redux存储时未定义this.props.onPress（行）

我已经让我的

React Native

应用程序运行

Redux

，正在尝试向我的商店添加嵌套数组项（产品）

屏幕应该如何工作

productScreen

中的数据是从上一个 屏幕（所选产品）

循环遍历数据，找到嵌套数组并将其显示在

FlatList

将所选产品添加/删除到购物车（redux）

什么工作

productScreen

中的数据是从上一个 屏幕（所选产品）

循环遍历数据，找到嵌套数组并将其显示在

FlatList

不起作用的是：

将所选产品添加/删除到购物车（redux）

当我导航到屏幕时，我得到的错误是this.props.onPress（行）不是一个函数。此.props.onPress（行）未定义

我试着在网上和官方网页上寻找解决方案，但找不到解决这个难题的方法。在我嵌套数组并在单独的组件上显示产品，然后将其加载到页面上之前，它确实可以工作

有人知道如何将嵌套数组添加到存储中吗

平面列表

        <FlatList
        style={styles.listContainer}
        data={this.state.filteredProducts}
        renderItem={this.renderItem}
        keyExtractor={(item, index) => index.toString()}
        />

Store.JS

import {createStore} from 'redux';
import cartItems from '../reducers/carItems';

export default store = createStore(cartItems)

const cartItems = (state = [], action) => {
    switch (action.type)
    {
        case 'ADD_TO_CART':
        // console.log('CarItems.JS', action.payload)
            if (state.some(cartItem => cartItem.id === action.payload.id)) {
                // increase qty if item already exists in cart
                return state.map(cartItem => (
                    cartItem.id === action.payload.id ? { ...cartItem, qty: cartItem.qty + 1 } : cartItem

                    ));

            }
            return [...state, { ...action.payload, qty: 1 }]; // else add the new item to cart

        case 'REMOVE_FROM_CART':
            return state
                .map(cartItem => (cartItem.id === action.payload.id ? { ...cartItem, qty: cartItem.qty - 1 } : cartItem))
                .filter(cartItem => cartItem.qty > 0);
    }
    return state
} 

export default cartItems 

cartItems.JS

import {createStore} from 'redux';
import cartItems from '../reducers/carItems';

export default store = createStore(cartItems)

const cartItems = (state = [], action) => {
    switch (action.type)
    {
        case 'ADD_TO_CART':
        // console.log('CarItems.JS', action.payload)
            if (state.some(cartItem => cartItem.id === action.payload.id)) {
                // increase qty if item already exists in cart
                return state.map(cartItem => (
                    cartItem.id === action.payload.id ? { ...cartItem, qty: cartItem.qty + 1 } : cartItem

                    ));

            }
            return [...state, { ...action.payload, qty: 1 }]; // else add the new item to cart

        case 'REMOVE_FROM_CART':
            return state
                .map(cartItem => (cartItem.id === action.payload.id ? { ...cartItem, qty: cartItem.qty - 1 } : cartItem))
                .filter(cartItem => cartItem.qty > 0);
    }
    return state
} 

export default cartItems 

---

看起来您正在将函数调用的结果传递到TouchableOpacity的onPress道具中

你可能想试着改变一下

到

this.props.onPress（行）}>

---

正如您在第二种情况下所做的。

看起来您正在将函数调用的结果传递到TouchableOpacity的onPress属性中

你可能想试着改变一下

到

this.props.onPress（行）}>

---

正如您在第二个案例中所做的。

嗨，丹尼尔，谢谢您的回答。当我按下按钮时，似乎仍然会出现同样的错误。听起来onPress道具可能未定义。你是不是打算改打addItemToCart/removeItem？请注意，

this.props.onPress

指的是屏幕上的道具组件，而不是视图组件。嗨，丹尼尔，谢谢你的回答。当我按下按钮时，似乎仍然会出现同样的错误。听起来onPress道具可能未定义。你是不是打算改打addItemToCart/removeItem？请注意，

this.props.onPress

指的是屏幕组件上的道具，而不是视图组件。