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

时间:2017-09-17 22:07:21

标签: javascript reactjs react-native redux

我一直在尝试将Redux实现到React-Native注册应用程序中,我正在努力创建一个多页面表单设置。

我一直收到这个错误:

enter image description here

请从应用的根容器中查看此处的相关代码:

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);

任何帮助将不胜感激

3 个答案:

答案 0 :(得分:2)

您没有创建mapStateToProps功能但尝试将其传递给connect功能。
为清晰起见,您应阅读DOCS

例如:

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

这会将navigationredux store作为道具传递给您的组件,以便您可以通过props.navigation

访问它

答案 1 :(得分:0)

错误非常明显。

您尝试将名为mapStateToProps的变量传递到connect函数,但您从未定义它。

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

您需要实际创建一个将状态映射到props的函数:

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

答案 2 :(得分:0)

在使用之前,您应该定义名为 mapStateToProps 的函数:

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