React Native类组件中Redux使用报错：数据无法存入Store

错误根源梳理 #

1. 方法调用名不匹配：mapDispatchToProps注入的是getDataMethod，但组件内调用的是this.props.getData，导致找不到方法触发_getDataMethod is undefined错误。
2. Reducer未处理数据存储：GET_ALL_ITEM分支仅返回原state，未将传入的payload存入Redux store。
3. mapStateToProps取值错误：Reducer的state是数组类型，state.getDataMethod不存在，导致this.props.data为undefined。
4. action.js冗余代码：重复定义并导出了相同的action creator，属于无效冗余。

分步修正代码 #

1. 修正组件内方法调用 #

将组件中的this.props.getData(dharadata)改为this.props.getDataMethod(dharadata)，与mapDispatchToProps中的方法名保持一致：

let dharadata = this.state.new_item;
consolepro.consolelog("product data", dharadata);
this.props.getDataMethod(dharadata); 
// 注意：Redux状态更新是异步操作，此处直接打印this.props.data无法获取最新值，建议在componentDidUpdate中监听

2. 修复Reducer的数据处理逻辑 #

修改GET_ALL_ITEM分支，根据业务需求将payload存入state（示例为替换全部数据，若需追加则用[...state, action.payload]）：

import { ADD_ITEM, REMOVE_ITEM, GET_ALL_ITEM } from '../redux/ActionTypes'

export const Reducers = (state = [], action) => {
    switch (action.type) {
        case ADD_ITEM:
            return [...state, action.payload];
        case REMOVE_ITEM:
            return state.filter((item, index) => index !== action.payload);
        case GET_ALL_ITEM:
            return action.payload; // 替换为传入的新数据
        default:
            return state;
    }
};

3. 修正mapStateToProps取值逻辑 #

由于state是数组类型，直接取整个state即可：

const mapStateToProps = state => ({
  data: state // 直接获取Redux中的数组状态
});

const mapDispatchToProps = {
   getDataMethod
};

export default connect(mapStateToProps, mapDispatchToProps)(HomeTicket);

4. 清理action.js冗余代码 #

删除重复的action creator定义，保留一份即可：

import { ADD_ITEM, REMOVE_ITEM, GET_ALL_ITEM } from "../redux/ActionTypes";

export const addItemToCart = data => ({
    type: ADD_ITEM,
    payload: data,
});

export const removeItemToCart = index => ({
    type: REMOVE_ITEM,
    payload: index,
});

export const getDataMethod = obj => ({
    type: GET_ALL_ITEM,
    payload: obj,
});

5. 处理Redux异步更新的问题 #

Redux状态更新为异步操作，调用action后立即打印props无法获取最新值，可通过componentDidUpdate监听props变化：

componentDidUpdate(prevProps) {
  if (prevProps.data !== this.props.data) {
    consolepro.consolelog("redux data", this.props.data);
  }
}

内容的提问来源于stack exchange，提问作者user19534405