title: How to use state in anonymous method using react in component
body: <p>I have react component like this:</p>
  
  <pre><code>import React, { Component } from 'react'
  import { Sidebar, Segment, Button, Menu, Image, Icon, Header } from 'semantic-ui-react'
  
  export default class Footer extends Component {
  
      constructor(props) {
          super(props)
          this.state = {
              visible: false
          }
          this.handleClick = this.handleClick.bind(this);
          this.handleClick();
      }
  
  
      handleClick() {
  
          this.props.socket.on('connect', function () {
              console.log("PRINT this.state.visible");
              console.log('Connected');
          });
  
          this.props.socket.on('disconnect', function () {
              console.log('Disconnected');
          });
      }
  
      render() {
          return (
              &lt;div className='create-task-section'&gt;
                  "HELLO"
              &lt;/div&gt;
          )
      }
  }
  </code></pre>
  
  <p>I am using websocket io. In method <code>this.props.socket.on</code> I want print   </p>
  
  <p><code>this.state = {
        visible: false
  }</code></p>
  
  <p>But when I print this variable, I am getting undifined error. How can I read/change/update <code>this.state</code> values in anonymous method like<code>this.props.socket.on</code>?</p>
  
  <p>Thank you for your help!</p>