Реагировать-Native. Оператор If-Else не работает

Question

Может кто-нибудь помочь мне с моей проблемой? Я хочу начать, когда this.state.counter достигает 0. Я не вижу, где моя проблема. Конфетти работает, когда я использую его без оператора IF-Else. Спасибо за ваше время:)

import React from "react";
    import {
      StyleSheet,
      Button,
      View,

    } from "react-native";

    import Confetti from 'react-native-confetti';


    export default class App extends React.Component {

      state = {
        counter: 2
      };

      componentDidMount() {
        if (this._confettiView) {
          this._confettiView.startConfetti();
        }
      }

      render() {
        return (
          <View style={styles.container}>
            {this.state.counter == 0 ? <Confetti ref={(node) => this._confettiView = node} /> : null}
            <Button
            title="Press"
              onPress={() => this.setState({ counter: this.state.counter - 1 })}>
            </Button>
          </View>
        );
      }
    }
    const styles = StyleSheet.create({
      container: {
        flex: 1,
        backgroundColor: "#87CEEB"
      }
    });

Answer 1

Вам просто нужно вырезать ваш дисплей в другой функции и добавить условие в displayFunction:

render() {
    return(
        <View>
        {this.displayCounter()}
        </View>
    )
}
displayCounter(){
    if(this.state.counter == 0){

        return (
            <View style={styles.container}>
                <Button
                title="Press"
                onPress={() => this.setState({ counter: this.state.counter - 1 })}>
                </Button>
            </View>
        );

    }
}
      

Надеюсь, это поможет вам