I am trying to go from one screen to the next in my react-native application but nothing is happening when the button is selected. I am using a Stack Navigation and from all other research I have done it seems as though my pages are setup correctly please let me know if you see any problems.
Root Stack
import React from 'react' import {createSwitchNavigator} from 'react-navigation' import AuthNavigator from './stacks/AuthNavigator' /** * This document handles manging the switch navigatiors for the supplied stacks * This means that each navigator mentioned in this file contains other navigators in their files */ const RootStack = createSwitchNavigator( { Auth: AuthNavigator }, { initialRouteName: 'Auth' } ) export default RootStackAuthNavigator.JS
import React from 'react' import {createStackNavigator} from 'react-navigation-stack' import LoginSignUpView from '../../../src/page/account/LoginSignUpView' import SignUpView from '../../../src/page/account/SignUpView' const AuthNavigator = createStackNavigator( {"LoginSignUpView": LoginSignUpView,"SignUpView": SignUpView, } , { initialRouteName: "LoginSignUpView" } );LoginSignupView (With Button Not Working)
import React, {Component} from 'react' import {View, ScrollView, Text, Image} from 'react-native' import LaunchOptions from '../../components/applaunch/LaunchOptions' import LaunchButtonStyle from '/Users/Documents/Mobile Applications/src/styles/Launch/LaunchButtonsStyle.styles.js' import LaunchButton from '../../components/applaunch/LaunchButton' import ImageStylesStyles from '../../styles/common/ImageStyles.styles' /** * This page allows a user to have the option to login or sign up to the application * This page is the main controller of the Login/SignUp View ... All components should be placed here. * User will look at this view */ class LoginSignUpView extends Component { // NEED TO CHANGE NAVIGATION BAR COLOR -- CHECKOUT HOW BOOKIT IS DOING THIS static navigationOptions = { title: 'The Plug ', headerStyle: {backgroundColor: 'black'}, headerTitleStyle: {color: 'white', fontFamily: 'Impact', fontSize: 30} , }; render(){ return(<ScrollView style= {{backgroundColor: 'black'}}><View><Image source = {require('../../Images/FontSearch.png')} style = {ImageStylesStyles.logoDefaultStyle} /><LaunchOptions text={'Create Account'}//-----------------------BUTTON NOT WORKING HERE VVVVV onPress={() => this.props.navigation.navigate("SignUpView")} buttonStyle={LaunchButtonStyle.largeRoundBtn} textStyle={LaunchButtonStyle.textStyle} /></View><View style={{ borderBottomColor: 'white', borderBottomWidth: 1,marginTop: 40 }} /> <View><LaunchButton text={"Already have an account? Login"} onPress={"props.OnPress"} textStyle={LaunchButtonStyle.smallLgnSignupBtnTextStyle} /></View></ScrollView> ) } } export default LoginSignUpViewLaunchOptions:
import React from 'react'import {View, Text, ScrollView} from 'react-native'import launchTextStyle from '/Users/Documents/Mobile Applications/ThePlugNetwork/src/styles/loginSignUpTextStyle.styles.js'import Button from '/Users/Documents/Mobile Applications/src/components/common/Button.js'/** * Application Launch View for user to select to login or signup * * @param {*} props */ const LaunchOptions = (props) => { return(<ScrollView><View><Text style={launchTextStyle.bigTextTop}>Stay</Text><Text style={launchTextStyle.bigText}>Connected</Text><Text style={launchTextStyle.mediumText}>With The Latest</Text><Text style={launchTextStyle.smallText}>Government Updates</Text></View><View><Button onPress={props.OnPress} buttonStyle={props.buttonStyle} textStyle={props.textStyle}> {props.text}</Button> </View></ScrollView> ) } export default LaunchOptions