React Native Router Flux-如何更改父状态

时间:2019-07-19 05:37:31

标签: react-native react-native-router-flux

我想在ActivityIndicator组件中使用单个App,并且每次加载到应用程序时都希望使用它:

import React from "react";
import {Router, Scene} from 'react-native-router-flux';
import { View, ActivityIndicator } from 'react-native';
import Tutorial from './views/Tutorial';
import PhoneAuth from "./views/PhoneAuth";
import Profile from "./views/Profile";
import Home from './views/Home';

import { startupConfiguration } from './utils/storage';

export default class App extends React.Component {
  constructor(props) {
    super(props);

    this.state = { 
      hasShownTutorial: false,
      isAuthenticated: false,
      hasSetProfile: false,
      progress: true,
    };

  }

  componentWillMount() {
    startupConfiguration().then((configuration) => {
        configuration.progress = false;
        this.setState(configuration);
    });
  }

  render() {
    if (this.state.progress) {
      return (
        <ActivityIndicator size='large'/>
      )
    } else {
      return (
        <Router>
          <Scene key='root'>
            <Scene
              component={Tutorial}
              hideNavBar={true}
              initial={!this.state.hasShownTutorial}
              key='Tutorial'
              title='Tutorial'
            />
            <Scene
              component={PhoneAuth}
              hideNavBar={true}
              initial={this.state.hasShownTutorial && !this.state.isAuthenticated}
              key='PhoneAuth'
              title='Phone Authentication'
            />
            <Scene
              component={Profile}
              hideNavBar={true}
              initial={this.state.hasShownTutorial && this.state.isAuthenticated && !this.state.hasSetProfile}
              key='Profile'
              title='Profile'
            />
            <Scene
              component={Home}
              hideNavBar={true}
              initial={this.state.hasShownTutorial && this.state.isAuthenticated && this.state.hasSetProfile}
              key='Home'
              title='Home'
            />
          </Scene>
        </Router>
      );
    }
  }
}

如您所见,我有一个进度状态,该状态在第一次加载应用程序时显示一个ActivityIndi​​cator。 我只想显示从下面的一个场景发送事件的进度。

如何做到这一点?

0 个答案:

没有答案