如何從另一個類刷新React-Native中的主要App類渲染

Question

我正在嘗試使用React-Native創建我的第一個應用程序，我創建了一個呈現身份驗證表單的類，在處理了提交后，應用程序應使用其選項卡呈現導航屏幕。 我認為我可以從“身份驗證”屏幕中以某種方式“刷新”應用程序類渲染，以便它可以再次檢查用戶是否已通過身份驗證，但是我不確定

App.Js：

import AuthScreen from './screens/AuthScreen';

export default class App extends React.Component {
  state = {
    isLoadingComplete: false,
    isAuthenticated: false,
  };

  render() {
    if (!this.state.isLoadingComplete && !this.props.skipLoadingScreen) {
      return (
        <AppLoading
          startAsync={this._loadResourcesAsync}
          onError={this._handleLoadingError}
          onFinish={this._handleFinishLoading}
        />
      );
    } else {
      if(this.state.isAuthenticated == true) {
        return (
          <View style={styles.container}>
            <StatusBar hidden = {true} />
            <AppNavigator />
          </View>
        );
      } else {
        return (
          <View style={styles.container}>
            <StatusBar hidden = {true} />
            <AuthScreen />
          </View>
        );
      }
    }
  }

AuthScreen.js：

export default class AuthScreen extends Component {
  handleSubmit = () => {
    const value = this._form.getValue();
    console.log('value: ', value);
  }

  render() {
    return (
      <View style={styles.container}>
        <View style={styles.auth_container}>
          <Form
            ref={c => this._form = c}
            type={User}
            options={options}
          />
          <Button
            title="Submit"
            onPress={this.handleSubmit}
          />
        </View>
      </View>
    );
  }
}

Answer 1

您可以通過使用react-navigation （RN導航庫）來實現。 但是每個有問題的代碼都試圖在屏幕之間切換。

以您的方式：如果成功跟隨handleSubmit方法

handleSubmit = () => {
    check auth logic
    this.props.onSuccessFullLogin(value)
}

在ParentComponent中更新狀態以在屏幕之間切換App Component ：

<AuthScreen />這應該類似於<AuthScreen onSuccessFullLogin={()=>this.setState({isAuthenticated:true})} />