React Native集成Redux报(0, _combineReducers.default)不是函数问题求助

问题根因&修复方案 #

• 第一个错误：文件名拼写不匹配
  你app.js中导入的路径是./redux/reducers/combineReducers，但实际合并reducer的文件名为combinedReducers.js，多了字母d，路径不匹配会导致模块导入异常，出现default is not a function类的报错。首先统一文件名为combineReducers.js，保证导入路径和实际文件名一致。

• 第二个错误：未正确创建store实例
  你仅在合并reducer文件中调用了combineReducers生成根reducer，没有调用对应的方法生成store实例，所以app.js中导入的store本身是不存在的，无论写store()还是直接传store都会报错。

修复代码

1. 修改combineReducers.js代码：

import { key } from "./reducerKey";
import { combineReducers, createStore } from 'redux'

const rootReducer = combineReducers({
    storeKey: key,
})
// 生成store实例并导出
export const store = createStore(rootReducer)

如果使用的是Redux v5及以上版本，createStore已被标记为废弃，推荐直接使用Redux Toolkit写法，安装@reduxjs/toolkit后修改为：

import { key } from "./reducerKey";
import { configureStore } from '@reduxjs/toolkit'

export const store = configureStore({
  reducer: {
    storeKey: key
  }
})

2. 修改app.js代码：

import React from 'react';
import { Provider } from 'react-redux';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import { NavigationContainer } from '@react-navigation/native';
import { store } from './redux/reducers/combineReducers'

const Stack = createNativeStackNavigator()
export default function App() {
  return (
    <Provider store={store}>
      {/* 补充你的导航及页面逻辑 */}
      <NavigationContainer>
        <Stack.Navigator>
          {/* 配置你的路由页面 */}
        </Stack.Navigator>
      </NavigationContainer>
    </Provider>
  );
}

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