React Native集成Redux后this.props.getUser不是函数问题排查

嘿，咱先把核心问题揪出来：你用connect想把getUser注入组件props，但没成功，所以props里只有路由相关的screenProps和navigation。下面一步步排查解决：

1. 先确认Redux Provider有没有包裹整个应用 #

这是最容易踩的坑！如果你的根组件没被Provider包住，connect根本找不到Redux store，自然不会给组件注入任何映射的方法或者状态。

赶紧去看你的入口文件（比如App.js或者index.js），得写成这样：

import { Provider } from 'react-redux';
import store from './path-to-your-store'; // 替换成你store的实际路径
import homeNav from './path-to-homeNav'; // 你的导航组件路径

export default function App() {
  return (
    <Provider store={store}>
      <homeNav />
    </Provider>
  );
}

要是没这一步，connect完全就是摆设，组件只能拿到路由传的props。

2. 检查mapStateToProps的定义 #

你代码里用了connect(mapStateToProps, mapDispatchToProps)(homeNav)，但没给mapStateToProps的具体代码。如果这个变量没定义或者是undefined，虽说connect允许第一个参数传null/undefined，但偶尔也会导致映射出问题。

要是你不需要把state映射到props，直接传null就行：

export default connect(null, mapDispatchToProps)(homeNav);

可别让mapStateToProps变成一个未声明的变量，那会直接报错或者让连接失效。

3. 异步Action Creator的问题也得修（不然之后功能还是不正常） #

就算解决了props注入的问题，你的user action creator还有几个小问题，不修好没法触发reducer：

• 你的user是个thunk函数，但内部的request/success/failure是内部函数，而且thunk里只dispatch了request，没加实际的异步逻辑（比如API请求）。
• 最重要的：你得在store里配置Redux Thunk中间件，不然Redux没法处理这种返回函数的action creator。

修复后的Action Creator示例： #

// 先确保你已经定义了这些action type常量
import { GET_USER_REQUEST, GET_USER_SUCCESS, GET_USER_FAILURE } from './action-types';

export function fetchUser() {
  return dispatch => {
    dispatch(request({}));
    // 这里加你的异步请求，比如调用后端API
    fetch('你的用户接口地址')
      .then(res => res.json())
      .then(user => dispatch(success(user)))
      .catch(error => dispatch(failure(error)));
  };
}

// 内部action创建函数
function request(user) { return { type: GET_USER_REQUEST, user }; }
function success(user) { return { type: GET_USER_SUCCESS, user }; }
function failure(error) { return { type: GET_USER_FAILURE, error }; }

配置Redux Thunk中间件： #

在创建store的文件里这么写：

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './path-to-root-reducer'; // 你的根reducer路径

const store = createStore(
  rootReducer,
  applyMiddleware(thunk) // 必须加这个才能处理thunk类型的action
);

export default store;

4. 最后检查组件导出 #

要确保homeNav是个合法的React组件，而且你导出的是被connect包裹后的版本，不是原始的导航器组件。比如别在别的地方又导出了一个没被connect处理的homeNav，那之前的操作就白做了。

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