React Native项目出现TypeError: Cannot read property 'store' of undefined求助

问题分析 #

你遇到的TypeError: Cannot read property 'store' of undefined错误，结合依赖配置与代码来看，核心原因是依赖版本不兼容：

• Redux 5.0.0属于较新版本，redux-thunk 3.1.0、react-redux 9.0.2与其适配性存在问题
• createStore在Redux 5.x中已被标记为废弃API，使用该API可能触发未预期的初始化异常

解决方案 #

方案1：切换至兼容的依赖版本 #

将package.json中的依赖替换为经过验证的兼容组合：

"dependencies": {
    "@react-native-async-storage/async-storage": "^1.21.0",
    "react": "18.2.0",
    "react-native": "0.73.0",
    "react-redux": "^8.1.3",
    "redux": "^4.2.1",
    "redux-logger": "^3.0.6",
    "redux-persist": "^6.0.0",
    "redux-thunk": "^2.4.2"
}

执行npm install或yarn install重新安装依赖，之后清除缓存重启项目。

方案2：使用Redux官方推荐的configureStore #

Redux 5.x官方推荐用@reduxjs/toolkit的configureStore替代createStore，它内置了thunk等中间件，兼容性更强：

1. 安装依赖：

npm install @reduxjs/toolkit

2. 修改store.js：

import AsyncStorage from '@react-native-async-storage/async-storage';
import {persistStore, persistReducer} from 'redux-persist';
import {configureStore} from '@reduxjs/toolkit';

import reducers from './reducers';

const persistConfig = {
  key: 'root',
  storage: AsyncStorage,
  blacklist: [],
};

const pReducer = persistReducer(persistConfig, reducers);

const store = configureStore({
  reducer: pReducer,
  middleware: (getDefaultMiddleware) => 
    getDefaultMiddleware().concat(require('./middlewares').default)
});

const persister = persistStore(store);

export {store, persister};

3. 若无需额外自定义中间件，可直接移除middlewares.js，因为configureStore已内置thunk。

方案3：调整中间件顺序 #

若坚持使用现有版本，修改middlewares.js调整中间件顺序（thunk需在logger之前）：

import {createLogger} from 'redux-logger';
import thunk from 'redux-thunk';

const middleware = [];
const logger = createLogger();

// 确保thunk优先加载
middleware.push(thunk, logger);

export default middleware;

部分旧版中间件对加载顺序敏感，错误顺序会导致store初始化失败。

验证操作 #

1. 清除项目缓存：npx react-native start --reset-cache
2. 重新构建项目：npx react-native run-android / npx react-native run-ios

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