Показывать загрузчик при нажатии кнопки

Question

Я пытаюсь получить загрузчик при нажатии кнопки (для регистрации) без создания другой страницы (только для отображения загрузчика).Как я могу сделать??

Это мой код и то, что я пробовал (но он не появляется)

class Signup extends Component {
  constructor(props) {
    super(props);
    this.state = {
     //code about signup
      isLoading: false
    };
  }

  showLoader = () =>{
    this.setState({ isLoading: true})
    this.registrazione()
  }
  registrazione() {
    //code about signup

  }

  render() {
    return (
      <View style={style.container}>
        //code about signup
          <View style={style.footer}>
            <TouchableOpacity
              style={[style.button, style.buttonOK]}
              onPress={() => this.showLoader()}
            >
              <Text style={[style.buttonTesto]}>Signup</Text>
            </TouchableOpacity>
            <ActivityIndicator animating={this.state.isLoading} size="large" color="#56cbbe" />
          </View>
        </KeyboardAwareScrollView>
      </View>
      </View>
    );
  }
}

Answer 1

Прежде всего у вас есть один закрывающий тег просмотра, который не нужен.Предполагая, что это просто рассматриваемая ошибка, вы можете сделать это с помощью троичного оператора JS.Например:

<View style={style.container}>
        //code about signup
          <View style={style.footer}>
            {(!this.state.isLoading) ? <TouchableOpacity
              style={[style.button, style.buttonOK]}
              onPress={() => this.showLoader()}
            >
              <Text style={[style.buttonTesto]}>Signup</Text>
            </TouchableOpacity> : <ActivityIndicator animating={this.state.isLoading} size="large" color="#56cbbe" />}
          </View>
        </KeyboardAwareScrollView>
</View>

Подробнее о троичных операторах можно узнать здесь

Это должно заменить вашу кнопку загрузкой анимации.

Нестесняйтесь задавать еще вопросы, если у вас есть какие-либо!Я рад помочь!