React Native Redux：错误无法找到变量mapStateToProps

Question

I have been attempting to implement Redux into a React-Native registration app I'm working on to create a multi page form set up.

I keep getting this error:

Please review the pertaining code here under from the app's root container:

 import React, { Component } from 'react'; import ReactNative from 'react-native'; import { AppRegistry,Text,View,} from 'react-native'; import { Button } from 'react-native-elements' import { StackNavigator } from 'react-navigation' import store from '../store/store'; import { Provider,connect } from 'react-redux'; import Register1 from './emailandpass' import Register2 from './namefields' //import login from './login' //import confirmation from './confirmation' //import success from './success' class Loginscreen extends React.Component{ static navigationOptions= { title: 'Welcome to LearnD', } render() { const { navigate } = this.props.navigation; return( <Provider store={store}> <View> <Text>Have you got an account ?</Text> <Button onPress={()=> navigate('Register1')} title="Register here !" /> </View> </Provider> ); } }; const App = StackNavigator({ Home: { screen: Loginscreen}, Register1: {screen: Register1 }, Register2: {screen: Register2} }); export default connect(mapStateToProps)(Landingscreen); 

Any help would be appreciated

Answer 1

You did not create a mapStateToProps function yet you try to pass it to the connect function.
You should read the DOCS for clarity

For example:

function mapStateToProps(state) {
  return {
    navigation: state.navigation 
  }
}

This will pass the navigation from redux store as a prop to your component so you can access it via props.navigation

Answer 2

The error is pretty self-explanatory.

You're trying to pass a variable named mapStateToProps into the connect function but you never defined it.

export default connect(mapStateToProps)(Landingscreen);
//                     ^ this isn't defined anywhere

You need to actually create a function that will map the state to props:

function mapStateToProps(state) {
  // ...
}
export default connect(mapStateToProps)(Landingscreen);

Answer 3

You should define the function named mapStateToProps before using it:

 const mapStateToProps = ( state ) => { const someProp = state.get('someProp'); return { someProp } }