Navigieren zu einer anderen Seite innerhalb von if-Anweisung

Question

Ich baue ein React Native-Projekt mit reactive-native-router-flux, und ich habe ein bisschen Probleme mit der Navigation. Im Grunde baue ich eine Anmeldeseite auf, die die E-Mail/das Passwort mit der Datenbank vergleicht und das Zugriffstoken speichert, wenn es übereinstimmt. Dann möchte ich sofort von der Anmeldeseite zur Homepage navigieren, bin mir aber nicht sicher, wie ich das erreichen soll. Es sieht so aus, als ob {Actions.SceneKey} nur funktioniert, wenn es onPress ist. Hier ist mein Code für die Login-Seite:

'use strict' 
 

 
import React, { Component } from 'react'; 
 
import { AsyncStorage, StyleSheet, Text, View, TouchableHighlight, AlertIOS,} from 'react-native'; 
 
import { Actions } from 'react-native-router-flux' 
 
import t from 'tcomb-form-native' 
 

 
import ViewContainer from '../components/ViewContainer'; 
 
import StatusBarBackground from '../components/StatusBarBackground'; 
 

 
var STORAGE_KEY = 'access_token'; 
 

 
var Form = t.form.Form; 
 

 
var Person = t.struct({ 
 
    email: t.String, 
 
    password: t.String 
 
}); 
 

 
const options = {}; 
 

 
var LoginIndexScreen = React.createClass({ 
 

 
    async _onValueChange(item, selectedValue) { 
 
    try { 
 
     await AsyncStorage.setItem(item, selectedValue); 
 
     {Actions.HomeScreen} 
 
    } catch (error) { 
 
     console.log('AsyncStorage error: ' + error.message); 
 
    } 
 
    }, 
 

 
    _userSignup() { 
 
    var value = this.refs.form.getValue(); 
 
    if (value) { // if validation fails, value will be null 
 
     fetch("https://EXAMPLE.herokuapp.com/oauth/token", { 
 
     method: "POST", 
 
     headers: { 
 
      'Accept': 'application/json', 
 
      'Content-Type': 'application/json' 
 
     }, 
 
     body: JSON.stringify({ 
 
      email: value.email, 
 
      password: value.password, 
 
     }) 
 
     }) 
 
     .then(console.log(response)) 
 
     .then((response) => response.json()) 
 
     .then((responseData) => { 
 
     this._onValueChange(STORAGE_KEY, responseData.id_token), 
 
     AlertIOS.alert(
 
      "Signup Success!" 
 
     ) 
 
     }) 
 
     .done(); 
 
    } 
 
    }, 
 

 
_userLogin() { 
 
    var value = this.refs.form.getValue(); 
 
     if (value) { // if validation fails, value will be null 
 
      fetch("https://EXAMPLE.herokuapp.com/oauth/token", { 
 
      method: "POST", 
 
      headers: { 
 
       'Accept': 'application/json', 
 
       'Content-Type': 'application/json' 
 
      }, 
 
      body: JSON.stringify({ 
 
       email: value.email, 
 
       password: value.password, 
 
      }) 
 
      }) 
 
      .then((response) => response.json()) 
 
      .then((responseData) => { 
 
      if (responseData.access_token) { 
 
       console.log(responseData) 
 
       this._onValueChange(STORAGE_KEY, responseData.access_token) 
 
       {Actions.HomeScreen} 
 
      } else { 
 
       AlertIOS.alert(
 
        "Login failed due to: " + responseData.message 
 
       ) 
 
      } 
 
      }) 
 
      .done(); 
 
     } 
 
}, 
 

 
    render() { 
 
    return (
 
     <View style={styles.container}> 
 
     <View style={styles.row}> 
 
      <Form 
 
      ref="form" 
 
      type={Person} 
 
      options={options} 
 
      /> 
 
     </View> 
 
     <View style={styles.row}> 
 
      <TouchableHighlight style={styles.button} onPress={this._userSignup} underlayColor='#99d9f4'> 
 
      <Text style={styles.buttonText}>Signup</Text> 
 
      </TouchableHighlight> 
 
      <TouchableHighlight style={styles.button} onPress={this._userLogin} underlayColor='#99d9f4'> 
 
      <Text style={styles.buttonText}>Login</Text> 
 
      </TouchableHighlight> 
 
     </View> 
 
     </View> 
 
    ); 
 
    } 
 
}); 
 

 
var styles = StyleSheet.create({ 
 
    container: { 
 
    justifyContent: 'center', 
 
    marginTop: 50, 
 
    padding: 20, 
 
    backgroundColor: '#ffffff', 
 
    }, 
 
    title: { 
 
    fontSize: 30, 
 
    alignSelf: 'center', 
 
    marginBottom: 30 
 
    }, 
 
    buttonText: { 
 
    fontSize: 18, 
 
    color: 'white', 
 
    alignSelf: 'center' 
 
    }, 
 
    button: { 
 
    height: 36, 
 
    backgroundColor: '#48BBEC', 
 
    borderColor: '#48BBEC', 
 
    borderWidth: 1, 
 
    borderRadius: 8, 
 
    marginBottom: 10, 
 
    alignSelf: 'stretch', 
 
    justifyContent: 'center' 
 
    }, 
 
}); 
 

 
module.exports = LoginIndexScreen;

Jede Hilfe wäre sehr dankbar

Answer 1

Actions.SceneKey ist die medthod auf Actions. Sie müssen es also wie folgt nennen: Actions.SceneKey() oder Actions.HomeScreen().

Wenn Sie die Methode auf onPress wie diese onPress={Actions.HomeScreen} setzen, senden Sie die Methode als Stütze zu TouchableHighlight, die, wenn Sie auf die Taste drücken, aufgerufen wird.

So müssen Sie die Methode in Ihrem wenn Block rufen als Actions.HomeScreen()