React native router flux routing after register/login

Question

I want to route user to home page after registration successful. I tried something but it didn't work,and also i am not getting an error it just returns a blank screen please help! I am going to share some code if you need any other file please let me know

Signup.js

import React, { Component } from 'react';
import {
  StyleSheet,  
  View,
  TextInput,
  Text,
  TouchableOpacity,
  TouchableWithoutFeedback,
  Keyboard,
  ActivityIndicator 
} from 'react-native';

import Logo from '../components/Logo';
import { register } from '../store/actions/authActions';
import { connect } from 'react-redux';
import { Actions } from 'react-native-router-flux';
import Routes from '../components/Routes';
//import Example from '../components/circularProgress';

state = {

  username : '',
  name : '',
  email : '',
  password : '',
  message : null,
  isLoading: false
}

const goToLogin = () => {
  Actions.login()
}

const goToHome = () => {
  Actions.home()
}

const DismissKeyboard = ({children}) => (
  <TouchableWithoutFeedback onPress={Keyboard.dismiss}>
    {children}
  </TouchableWithoutFeedback>
);

class Signup extends Component {
  constructor(props) {
    super(props);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  state = {
    isLoading : false
  }

  handleSubmit(){
    this.setState({
      isLoading : true
    });
    this.props.register(this.state);
    this.setState({
      isLoading : false
    });
    console.log(this.props);
  } 

    render() {
    const isLoading = this.state.isLoading;
    const { isAuthenticated } = this.props;    

    if (isAuthenticated){
      return(
        <View>
          <Routes/>
        </View>
      )

    }
        return(
      <DismissKeyboard>
            <View style={styles.container}>
                <Logo/>
        <TextInput style={styles.inputBox}
          placeholder="UserName"
          placeholderTextColor = '#ffffff'
          onChangeText={(text) => this.setState({username: text})}
          />
        <TextInput style={styles.inputBox}
          placeholder="Name"
          placeholderTextColor = '#ffffff'
          onChangeText={(text) => this.setState({name: text})}
          />
        <TextInput style={styles.inputBox}
          placeholder="Email"
          placeholderTextColor = '#ffffff'
          onChangeText={(text) => this.setState({email: text})}
          />
        <TextInput style={styles.inputBox}
          placeholder="Password"
          placeholderTextColor = '#ffffff'
          onChangeText={(text) => this.setState({password: text})}
          secureTextEntry={true}
          />
          {isLoading ? (
            <ActivityIndicator color="#0000ff" />
          ):(
            <TouchableOpacity style={styles.button}>
              <Text style={styles.buttonText} onPress={this.handleSubmit}>Signup</Text>          
            </TouchableOpacity>
          )}

                <View style={styles.signupTextCont}>
                    <Text style={styles.signupText}>Already have an account?</Text>
                    <TouchableOpacity onPress={goToLogin}><Text style={styles.signupButton}> Sign in</Text></TouchableOpacity>
                </View>
            </View>
      </DismissKeyboard>    
    )     
    }
}

const mapStateToProps = (state) => ({
  isAuthenticated : state.auth.isAuthenticated,
  isLoading : state.auth.isLoading,
  error : state.error
});

export default connect(mapStateToProps , { register }) (Signup)

Routes.js

import React, { Component } from 'react';
import { Router, Scene, Stack } from 'react-native-router-flux'
import Home from '../pages/Home.js'
import About from '../pages/About.js'
import Login from '../pages/Login.js'
import Signup from '../pages/Signup.js'

export default class Routes extends Component{
  render(){
    return(
       <Router>
          <Stack key="root" hideNavBar={true}>
             <Scene key = "login" component = {Login} title = "Login" initial = {true}/>
             <Scene key = "signup" component = {Signup} title = "Signup"/>
             <Scene key = "home" component = {Home} title = "Home"/>
             <Scene key = "about" component = {About} title = "About"/>
          </Stack>
       </Router>
    )
  }
}

Answer 1

In signup Page after successful registration inside handleSubmit() write

Actions.home()

it will redirect to HomePage