How to use state in a function?

Navigation
1

I have the following code: 

export default class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      xsemana: '0',
      meses: '1',
      minutos: '1',
    };
  }

  calcula(){
    const total = this.state.xsemana *
    (52 * this.state.meses / 12) *
    this.state.minutos;
    alert(total);
  }

  render() {
return (
  <View style={styles.container}>
    <Text>Vezes por semana</Text>
    <TextInput style={styles.input} keyboardType='numeric' onChangeText={(text) => this.setState({xsemana: text.replace(/[^0-9]/g, ''),})} value={this.state.xsemana} />

    <Text>Quantos meses?</Text>
    <TextInput style={styles.input} keyboardType='numeric' onChangeText={(text) => this.setState({meses: text.replace(/[^0-9]/g, ''),})} value={this.state.meses} />

    <Text>Quantos minutos?</Text>
    <TextInput style={styles.input} keyboardType='numeric' onChangeText={(text) => this.setState({minutos: text.replace(/[^0-9]/g, ''),})} value={this.state.minutos} />

    <View style={{flex:1, backgroundColor:'red'}}>
      <Button title="Calcular" color="#417ee0" style={{height:80}} onPress={this.calcula}/>
    </View>

  </View>
  );
}
}

I want to make a calculation in the calcula() function, using the values of state above.

However, I'm getting the error:

  

undefined is not an object (evaluating 'this.state.xsemana')

How to use in my function, the states created above?

    
asked by anonymous 05.01.2018 / 04:35

1 answer

2

You must make a bind method of calcula() , so you can use this inside it. 

...
constructor(props) {
    super(props);
    this.state = {
      xsemana: '0',
      meses: '1',
      minutos: '1',
    };
    this.calcula = this.calcula.bind(this);
}
...

Recommended reading:

05.01.2018 / 04:46
How to enable debug () in PHP? [closed] Displaying div with jquery