Question

我有一个RootNav和MainNav，在我的RootNav中，我有一个登录和注册屏幕。当用户使用电子邮件和密码通过Firebase注册时，它会自动登录并登录MainNav。我希望能够将它们通过诸如NameScreen和Age Screen之类的Firebase注册后发送到几个屏幕，以便用户输入其名称，以便将其添加到Firebase数据库中。

我正在使用stackNavigator。

App.js

import React from 'react';
import {Stylesheet, View, Text} from 'react-native';
import {AppLoading, Asset} from 'expo';
import * as firebase from 'firebase';

import RootNav from './navigation/RootNav';
import MainNav from './navigation/MainNav';

// SplashScreen
import SplashScreen from './screens/SplashScreen'

const firebaseConfig = {
   apiKey: "ProjectKey",
   authDomain: "projectDomain.com",
   databaseURL: "https://URl.com",
   pojectID: "pojectID",

}

export default class App extends React.Component{
  constructor(props){
   super(props);
   this.state = {
     isLoadingComplete: false,
     isAuthenticatingReady: false,
     isAuthenticated: false,
};

SplashScreen.load(v => this.setState({isLoadingComplete: true}));
if (!firebase.apps.length) {
  firebase.initializeApp(firebaseConfig);
}
firebase.auth().onAuthStateChanged(this.onAuthStateChanged);
}


onAuthStateChanged = (user) =>{
  this.setState({isAuthenticatingReady: true});
  this.setState({isAuthenticated: !!user});

}
 render(){
     return (
    <View style={{flex: 1,}}>

      {
        (this.state.isLoadingComplete) ? (this.state.isAuthenticated) ? 
        <MainNav /> : <RootNav /> : <SplashScreen />

      }
    </View>
  )
}
}

MainNav.js

import React from 'react';
import { createStackNavigator,} from 'react-navigation';
import MainScreen from './../screens/MainScreen';
import Check from './../navigation/Check';

const MainNav = createStackNavigator(
  {
     Check: {screen: Check},
     Home: { screen: MainScreen },

  },
  {
     navigationOptions: () => ({
        header: null,
     })
  }
);

export default MainNav;

RootNav.js

import React from 'react';
import { createStackNavigator,} from 'react-navigation';
import LoginScreen from './../screens/auth/LoginScreen';
import SignUpScreen from './../screens/auth/SignUpScreen';
import addNameScreen from '../screens/auth/addNameScreen';
import addAgeScreen from '../screens/auth/addAgeScreen';

const RootNav = createStackNavigator(
  {
    Login: { screen: LoginScreen },
    SignUp: { screen: SignUpScreen },
    addName: {screen: addNameScreen},
    addAge: {screen: addAgeScreen},
  },
  {
    navigationOptions: () => ({
        header: null,
    })
  }
);

export default RootNav;

我该怎么做？任何迹象都会帮助我，谢谢。

如何在react native中创建多个注册屏幕

0 个答案: