Sorry, i'm new to react native. How do i do to make a button who change the value of a input text or just a text property? I'm trying to create a Text and put below a global variable (imc) with {} but it doesnt work to change the {imc} for the variable result, so, what i need to do now? My code and sorry for the mess of it ah:
import React, {useState} from 'react';
import { StyleSheet, View, Text, SafeAreaView, StatusBar, TextInput, TouchableOpacity, Image} from 'react-native';
export default function App() {
const [altura, setAltura] = useState('');
const [peso, setPeso] = useState('');
const [idade, setidade] = useState('');
const mudarResultado=()=>{};
var imc = peso / (altura*altura/10000)
function Calcular(){
alert(`Altura: ${altura}cm \nPeso: ${peso}kg \nSeu imc: ${imc.toFixed(2)} `);
if (imc < 18.5 ){
alert("Você está muito magro");
} else if (imc > 18.5 && imc < 25){
alert("Você está com um peso normal");
} else if (imc >= 25 && imc < 30){
alert("Você está com sobrepeso");
} else {
alert("Você está na faixa de obesidade");
}
}
return(
<SafeAreaView style={styles.container}>
<StatusBar />
<Text style={styles.titulo}>CALCULE SEU IMC</Text>
{/* campo de texto altura */}
<TextInput
style={styles.input}
placeholder='Altura(cm)'
keyboardType='numeric'
value={altura}
onChangeText={(altura)=>setAltura(altura)}
/>
{/* campo de texto peso */}
<TextInput
style={styles.input}
placeholder='Peso (kg)'
keyboardType='numeric'
value={peso}
onChangeText={(peso)=>setPeso(peso)}
/>
{/* campo de texto idade */}
<TextInput
style={styles.input}
placeholder='Idade (anos)'
keyboardType='numeric'
value={idade}
onChangeText={(idade)=>setidade(idade)}
/>
{/* Button */}
<TouchableOpacity style={styles.botao}onPress={Calcular}>
<Text style={styles.btn_txt}>CALCULAR</Text>
</TouchableOpacity>
<Text style={styles.ideal}>Resultado IMC</Text>
<Text> IMC: {imc} </Text>```
I don't know if i understood your question, but, if you want to change a variable value, by pressing a button, you first have to put the variable in the "memory of the screen" that is, in the state, like you did in:
const [altura, setAltura] = useState('');
So you should do something like this
const [imc, setIMC] = useState(0);
And after, create a function that calculates the IMC, I recomend you always use arrow function because it prevents some bugs in the future.
const CalculateIMC = () => {
let imc = peso / (altura*altura/10000); // I used "let" instead of "var" because "let" only exists inside this function so it uses less memory. Think about largers aplications
setIMC(imc); // Here you are setting the variable imc in the memory of yout screen
// After this you can use your logic to determinates in what category the user is.
}
After that you can delete this line
var imc = peso / (altura * altura / 10000)