我有一个React Native组件,我正在尝试通过连接将该组件连接到react-redux,但是我遇到了错误

时间:2020-01-02 05:44:15

标签: reactjs react-native react-redux

我有一个react native组件,并且我试图通过connect将那个组件连接到react-redux,但是我在声明为route定义的getScreen()并没有返回有效屏幕的过程中遇到错误。 但是当我从组件中删除连接时,它在导航器中可以正常工作。但是当我使用connect时,我得到了错误。

下面是组件

class LoginScreen extends Component {

  componentDidMount() {
    // this.props.login();
    console.log(this.props.auth, 'this is staet')
  }

  render() {
    return (
      <Box f={1}>
        <Box f={1}>
          <ImageBackground source={images.bg} style={styles.container}>
            <Box bg="white" f={0.5} w="100%" p="lg" style={styles.abs}>
              <Text size={'2xl'}>
                OTP has been
              </Text>
              <Text size={'2xl'}>
                send to your mobile
              </Text>
              <Text size={'md'}>
                Verify your mobile number
              </Text>
            </Box>
          </ImageBackground>
        </Box>
      </Box>
    );
  }
}

export default
 connect(
  mapStateToProps, {
    login
  }
) 
(LoginScreen);

这是导航器文件

const AuthNavigator = createStackNavigator({
    Login: {
        getScreen: () => require('./LoginScreen').default
    }
}, {
    navigationOptions: {
        header: null
    }
})


const TabNavigator = createBottomTabNavigator({
    Home: {
        getScreen: () => require('./HomeScreen').default
    }
})


const MainNavigator = createStackNavigator({
    Tab: TabNavigator
});


const AppNavigator = createSwitchNavigator({
    Splash: {
        getScreen: () => require('./SplashScreen').default
    },
    Auth: AuthNavigator,
    Main: MainNavigator
}, {
    initialRouteName: 'Splash'
});

1 个答案:

答案 0 :(得分:1)

尝试此代码。

import LoginScreen from './screens/LoginScreen' const AuthNavigator = createStackNavigator({ Login: { screen: LoginScreen, } }, { navigationOptions: { header: null } })