Wie Callback-Funktion Ergebnis anfängliche Route in reagieren native.?

Question

Login ist die erste Route jedes Mal.

Ich möchte die Registerkarte anzeigen, wenn Benutzer anmelden. Ansonsten möchte ich zur Anmeldeseite navigieren.

class blabla extends Component { 
    constructor(props) { 
     super(props); 
     this.state = { 
     user: null 
     } 
    } 
    componentDidMount(){ 
    var _this = this; 
     FBLoginManager.getCredentials(function(error, data){ 
     if (!error) { 
      _this.setState({ user : data.credentials }); 
     } else { 
      _this.setState({ user : null }); 
     } 
     }); 
    } 
    render() { 
    console.log(this.state.user) 
    // 1. render -> null 
    // 2. render -> data 
    return (
     <NavigatorIOS ref="navigator" 
     style={styles.nav} 
     initialRoute={{ 
      title: "blabla", 
      component: this.state.user != null ? TabPage : Login, 
     }} /> 
    ); 
    } 
} 

dieses Problem gelöst, ich zweimal Anweisung und die Code es6 Syntax ersetzen ES5, weil ich Gebrauch if(!_this.isMounted()) return; in es6 Syntax nicht kennen.

getInitialState: function(){ 
    return { 
     credentials: undefined, 
     load:true 
    }; 
    }, 


    componentDidMount: function(){ 
    var _this = this; 
    FBLoginManager.getCredentials(function(error, data){ 
     if(!_this.isMounted()) return; 
     if (!error) { 
     _this.setState({ credentials : data.credentials,load:false }); 
     } else { 
     _this.setState({ credentials : false,load:false }); 
     } 
    }); 
    }, 

    render: function() { 
    if (this.state.load) { 
     return <View style={{flex:1,justifyContent:"center"}}><Text style={{textAlign:"center"}}>loading...</Text></View> 
    } 
    return <NavigatorIOS ref="nav" 
     style={{flex:1}} 
     navigationBarHidden={false} 
     rightButtonTitle="Profile" 
     onRightButtonPress= {() => this.left()} 
     initialRoute={{ 
      title: "AnsApp", 
      component: this.state.credentials != undefined && this.state.credentials != false ? TabPage : Profile , 
     }} /> 
    }, 

Answer 1

Hoffe das hilft Ihnen. Es ist Samstag und ich arbeite hart an meinem Portfolio, aber ich habe einige Verbesserungen vorgenommen und einige Teile geklärt. Fühlen Sie sich frei, mich zu fragen, wenn Sie Fragen haben: smiley:

class blabla extends Component { 
    constructor(props) { 
     super(props); 
     this.state = { 
     user: null , 
     loggedInn: !true 
     } 
    } 
    componentDidMount(){ 
    var _this = this; 
     FBLoginManager.getCredentials(function(error, data){ 
     if (this.state.loggedInn = !true) { 
      _this.setState({ user : data.credentials }); 
     } 
      return this.state; 
     }); 
    }, 
    Logon() { 
    // your this.state validation 
    } 
    render() { 
    console.log(this.state.user) 
    // 1. render -> null 
    // 2. render -> data 
    return (
     <NavigatorIOS ref="navigator" 
     style={styles.nav} 
     initialRoute={{ 
      title: "blabla", 
      component: this.state == Logon ? TabPage : Login, 
     }} /> 
    ); 
    } 
}