React-Native-Android: нажатие кнопки, которая изменит текст в зависимости от нажатой кнопки

Question

Здравствуйте, я все еще работаю над своим простым калькулятором, и у меня есть этот набор кодов, который выполняет вычисления или функции / события

export default class App extends Component {
constructor(props){
    super(props);
    this.state = {
        firstInput: '',
        secondInput: '',
        sum: 0,
        difference: 0,
        product: 0,
        quotient: 0,
        result: 0,
    };
}


//CALCULATIONS FORMULA

calculateSum = () => {
    const { firstInput, secondInput } = this.state;

    this.setState({
        sum: Number(firstInput) + Number(secondInput)
    });
}

calculateDifference = () => {
    const { firstInput, secondInput } = this.state;

    this.setState({
        difference: Number(firstInput) + Number(secondInput)
    });
}

calculateProduct = () => {
    const { firstInput, secondInput } = this.state;

    this.setState({
        product: Number(firstInput) + Number(secondInput)
    });
}

calculateQuotient = () => {
    const { firstInput, secondInput } = this.state;

    this.setState({
        quotient: Number(firstInput) + Number(secondInput)
    });
}



//stores input from user
storeFirstInput = (number1) => {
    this.setState({firstInput: number1})
}

storeSecondInput = (number2) => {
    this.setState({secondInput: number2})
}

, и это текст, который я хочу изменитьв зависимости от того, какая кнопка нажата

<View style={styles.answerContainer}>
                {/****** ANSWER HOVERING TEXT ******/}
                <Text 
                style = {{
                fontWeight: 'bold',
                fontSize: 30,
                color: '#242582',

                }}> 
                ANSWER: 
                </Text>

                {/****** RESULT OF USER INPUT ******/}
                <Text 
                style={styles.answerText}

                > 
                {this.state.sum}
                </Text>

            </View>

У меня есть 4 кнопки, а именно +, -, * и / (сумма, разница, продукт и частное)

<View style={styles.buttonContainer}>
                {/****** ADD BUTTON CONTAINER ******/}
                <View Style={styles.addButtonContainer}>
                        <TouchableOpacity Style={styles.addButtonDesign} 
                        onPress={this.calculateSum}
                        >
                                <Text style ={styles.buttonText}> + </Text>
                        </TouchableOpacity>
                </View>

                {/****** SUBTRACT BUTTON CONTAINER ******/}
                <View Style={styles.subtractButtonContainer}>
                        <TouchableOpacity Style={styles.subButtonDesign}
                        onPress={this.calculateDifference}
                        >
                                <Text style ={styles.buttonText}> - </Text>
                        </TouchableOpacity>
                </View>

                {/****** MULTIPLY BUTTON CONTAINER ******/}
                <View Style={styles.multiplyButtonContainer}>
                        <TouchableOpacity Style={styles.mulButtonDesign}
                        onPress={this.calculateProduct}
                        >
                                <Text style ={styles.buttonText}> * </Text>
                        </TouchableOpacity>
                </View>

                {/****** DIVIDE BUTTON CONTAINER ******/}
                <View Style={styles.divideButtonContainer}>
                        <TouchableOpacity Style={styles.divButtonDesign}
                        onPress={this.calculateQuotient}
                        >
                            <Text style ={styles.buttonText}> ÷ </Text>
                        </TouchableOpacity>
                </View>

, и этогде проблема приходит!Всякий раз, когда я нажимаю кнопку -, * или /, он не отображает правильную формулу, он всегда просто отображает сумму.Есть ли какой-нибудь способ сделать оператор IF где-нибудь в коде, где нажата кнопка IF - он вставит {this.state.difference} в текстовый раздел моего кода?Любая помощь будет высоко оценена!

Answer 1

У меня есть ответ после исследования, кажется, что ошибка была только с моей стороны.я изменил свой предыдущий код на

calculateQuotient = () => {
    const { firstInput, secondInput, result } = this.state;

    this.setState({
        result: Number(firstInput) / Number(secondInput),

    });
}

, а текстовый результат на

{this.state.result}

теперь он сохраняет значение, к которой нажимаю кнопку