不变违规:对象无效,无法作为React子级

时间:2019-11-05 04:26:39

标签: react-native redux react-redux react-navigation redux-persist

在运行react-native run-android时出现下一个错误,我真的不明白错误的来源。

我已经多次阅读了文档并遵循了一些教程,但是我无法对其进行修复。

以前,我使用过React-Navigation版本2,并且已经根据文档更新了所有内容,

错误: https://imgur.com/a/uxU45MH

这是代码:

App.js

headerRenderer

Routes.js

import React from 'react';
import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/integration/react';
import { store, persistor } from './data/store';
import ReduxRoutes from './routes/ReduxRoutes';
import SplashScreen from './screens/splash/SplashScreen';

export default class App extends React.Component {
    render(){
        return (
            <Provider 
                store={store}>
                <PersistGate
                    loading={SplashScreen}
                    persistor={persistor}
                >
                    <ReduxRoutes/>
                </PersistGate>
            </Provider>
        );
    }
}

ReduxRoutes.js

import React from 'react';
import { createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
import SplashScreen from '../screens/splash/SplashScreen';

const MainNavigator = createStackNavigator(
  {
    Splash: { screen: SplashScreen },
  },
  {
    initialRouteName: 'Splash', 
  }
);

const AppContainer = createAppContainer(MainNavigator);;

export default AppContainer;

store.js

import { connect } from 'react-redux';
import Routes from './Routes';
import { createReduxContainer } from 'react-navigation-redux-helpers';

const RoutesWithState = createReduxContainer(Routes, 'root');

const mapStateToProps = state => ({
    state: state.navigation
})

export default connect(mapStateToProps)(RoutesWithState);

及其依赖项:

import { createStore, applyMiddleware } from 'redux';
import { persistStore, persistReducer } from 'redux-persist';
import reducer from './index';
import AsyncStorage from '@react-native-community/async-storage';
import { createReactNavigationReduxMiddleware } from 'react-navigation-redux-helpers';

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

const persistedReducer = persistReducer(persistConfig, reducer);

const navigationMiddleware = createReactNavigationReduxMiddleware(
    //'root',
    state => state.navigation
)

const store = createStore(
    persistedReducer,
    applyMiddleware(navigationMiddleware)
)

const persistor = persistStore(store);

export { store, persistor };

0 个答案:

没有答案