title: How to prevent multiple clicks on a butoon in react native?
body: <p>I'm working on a project that involves signing in users and it it is working fine (I'm using firebase for authentication). However for signing in to occur, it needs some time depending also on the internet connection so I need to disable the button once it is clicked and re-enable it again. Here is my code:</p>
  <pre><code>class Login extends Component {
  
      handlelogin = () =&gt; {
      this.setState.errorMessage = '';
      const {email, password} = this.state;
      auth
        .signInWithEmailAndPassword(email, password)
        .then(() =&gt; this.props.navigation.navigate('Home'))
        .catch((error) =&gt; this.setState({errorMessage: error.message}));
    };
  
  render() {
  return (
  
       // Some code to handle input
  
        &lt;TouchableOpacity
        style={
          !this.state.email || !this.state.password
            ? styles.disabled
            : styles.button
        }
        disabled={!this.state.password || !this.state.email}
        onPress={this.handlelogin}&gt;
        &lt;Text style={{color: '#fff', fontWeight: '500'}}&gt;Sign in&lt;/Text&gt;
      &lt;/TouchableOpacity&gt;
  )}
  </code></pre>
  <p>I have tried this <a href="https://stackoverflow.com/a/46963918/14361363">answer</a> for my code to go like this but this didn't seem to work:</p>
  <pre><code>class Login extends Component {
  
      loginProcess = false;
  
      handlelogin = () =&gt; {
      this.setState.errorMessage = '';
      const {email, password} = this.state;
      auth
        .signInWithEmailAndPassword(email, password)
        .then(() =&gt; this.props.navigation.navigate('Home'))
        .catch((error) =&gt; {
          this.setState({errorMessage: error.message})
          this.loginProcess = false;
     });
  
    };
  
  render() {
  return (
  
       // Some code to handle input
  
        &lt;TouchableOpacity
        style={
          !this.state.email || !this.state.password
            ? styles.disabled
            : styles.button
        }
        disabled={!this.state.password || !this.state.email}
        onPress={()=&gt; {
            if (!loginProcess) {
                this.handleLogin;
                this.loginProcess = true;
            }
        }&gt;
        &lt;Text style={{color: '#fff', fontWeight: '500'}}&gt;Sign in&lt;/Text&gt;
      &lt;/TouchableOpacity&gt;
  )}
  </code></pre>
  <p>P.S This is my first question on stackoverflow, any hint for writing better questions is appreciated</p>