如何解决undefined不是React Native中的对象(评估'Component.router.getStateForAction')

时间:2019-06-11 05:42:11

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

我在将React Native的所有库从旧版本升级到最新版本时遇到了问题。

如果您能理解并为我提供可能的解决方案,请帮助我解决错误。

谢谢。

反应导航,redux,redux-saga

Package.json
{
  "name": "MyApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest",
    "android-bundle": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/",
    "android-release-build": "npm run android-bundle && cd android && ./gradlew assembleRelease && cd ..",
    "build:ios": "react-native bundle --entry-file='index.js' --bundle-output='./ios/MyApp/main.jsbundle' --dev=false --platform='ios' --assets-dest='./ios'"
  },
  "dependencies": {
    "2": "^2.0.0",
    "lodash.debounce": "^4.0.8",
    "moment": "^2.24.0",
    "prop-types": "^15.7.2",
    "react": "^16.8.4",
    "react-native": "0.59.9",
    "react-native-af-video-player": "^0.2.1",
    "react-native-gesture-handler": "^1.3.0",
    "react-native-htmlview": "^0.14.0",
    "react-native-image-progress": "^1.1.1",
    "react-native-keyboard-manager": "^4.0.13-12",
    "react-native-keyboard-spacer": "^0.4.1",
    "react-native-modal": "^11.0.1",
    "react-native-pdf": "^5.1.0",
    "react-native-permissions": "^1.1.1",
    "react-native-progress": "^3.6.0",
    "react-native-splash-screen": "^3.2.0",
    "react-native-storage": "^1.0.1",
    "react-native-tab-view": "^2.5.0",
    "react-native-version-number": "^0.3.6",
    "react-native-webview": "^5.11.0",
    "react-navigation": "^3.11.0",
    "react-redux": "^5.0.7",
    "redux": "^3.7.2",
    "redux-saga": "^0.16.0",
    "rn-fetch-blob": "^0.10.15"
  },
  "devDependencies": {
    "@babel/core": "7.4.5",
    "@babel/runtime": "7.4.5",
    "babel-jest": "24.8.0",
    "jest": "24.8.0",
    "metro-react-native-babel-preset": "0.54.1",
    "react-test-renderer": "16.8.3"
  },
  "jest": {
    "preset": "react-native"
  },
  "rnpm": {
    "assets": [
      "./app/assets/fonts/"
    ]
  }
}

Index.js



import { AppRegistry, SafeAreaView,StyleSheet } from 'react-native';
import App from './app/App';
import React from 'react';
import { Provider } from 'react-redux'
import configureStore from './app/redux'
import {fetchCinemaList} from './app/redux/actions'

const store = configureStore()
store.dispatch(fetchCinemaList());
const DemoApp = () => (
  <Provider store={store}>
      <App/>
  </Provider>
)


const styles = StyleSheet.create({
  safeArea: {
    flex: 1,
    flexGrow: 1,
    backgroundColor: 'white',
    shadowColor: 'transparent',
  },
});


export default store

AppRegistry.registerComponent('MyApp', () => DemoApp);


App.js

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import {DeviceEventEmitter, Platform, AppState,  } from 'react-native';
import React, {Component,} from 'react';
import {connect} from 'react-redux'
import {
  createDrawerNavigator,
  createStackNavigator,
  createAppContainer
} from 'react-navigation';
import SplashScreen from 'react-native-splash-screen';
import {Tabs} from './config/tabBarConfig'
import {SideMenu} from './components'
import { fetchCards,  fetchReservations, navigationChanged } from './redux/actions';
import store from '../index'
import {PromoSplash} from './screens/splash'
import {testUser} from './assets'
import KeyboardManager from 'react-native-keyboard-manager'
import { load,} from './services/utils';



if (Platform.OS == 'ios') KeyboardManager.setEnable(true);

function getCurrentRouteName(navigationState) {
  if (!navigationState) {
    return null;
  }
  const route = navigationState.routes[navigationState.index];
  if (route.routes) {
    return getCurrentRouteName(route);
  }
  return route.routeName;
}


const Nav = createDrawerNavigator({
  Tabs
},
{
  drawerOpenRoute: 'DrawerOpen',
  drawerCloseRoute: 'DrawerClose',
  drawerToggleRoute: 'DrawerToggle',
  contentComponent: props => <SideMenu {...props}/>
});

export const MainNav = createStackNavigator({
    Splash: { 
      name: "PromoSplash",
      screen: PromoSplash 
    },
    MainNavigator: { 
      name: "Nav",
      screen: Nav 
    }
  }, {
  headerMode: 'none',
  initialRouteName: "Splash",
})



class App extends Component {

  constructor (props) {
    super(props)
    this.state = {
      cineId: '',
      appState: AppState.currentState,
    }
  }

  async retrouveInfoCine() {
    const infoCine = await load('selectedCinema', "");
    this.setState({cineId: infoCine.id, });
  }


  componentWillMount() {
    fetchReservations(testUser);
  }


  render() {
    return (
      <MainNav
          onNavigationStateChange={(prevState, currentState) => {
          const currentScreen = getCurrentRouteName(currentState);
          const prevScreen = getCurrentRouteName(prevState);
          console.log("prevScreen, currentScreen", prevScreen, currentScreen)
          store.dispatch(navigationChanged(prevScreen, currentScreen))
          if (prevScreen !== currentScreen) {
              if (currentScreen == "Mes Réservations" || currentScreen == "MyCard") {
              let state = store.getState()
              if (currentScreen == "Mes Réservations" ) { //&& !state.reservations.reservations_fetched) {
                  console.log("Mes Reservations")
                  store.dispatch(fetchReservations(state.userInfo.token))
              } else {
                  store.dispatch(fetchCards(state.userInfo.token))
              }
              DeviceEventEmitter.emit('ModalVisible', { visible: true })
              }
              if (prevScreen == "Mes Réservations" || prevScreen == "MyCard") {
                  DeviceEventEmitter.emit('ModalVisible', { visible: false })
              }
              if (currentScreen == "Programme") {
                  SplashScreen.hide();
                  DeviceEventEmitter.emit('refreshData', {})
              }
              if (currentScreen == "Mon Cinéma") {
                DeviceEventEmitter.emit('refreshDatesList', {})
            }
          }
          }}
      />
    )
  }
}

const appFinal = createAppContainer(App);

export default connect()(appFinal)

我收到TypeError:尽管我已根据最新的导航代码要求更改了代码,但undefined不是对象(正在评估“ Component.router.getStateForAction”)错误。

Old Versions:
    "react-navigation": "^1.5.11",
    "react-redux": "^5.0.7",
    "redux": "^3.7.2",
    "redux-saga": "^0.16.0",

0 个答案:

没有答案