title: How to show/hide div in React?
body: <p>I want to show <code>&lt;div nameClass="showName"&gt;</code> when button is clicked and <code>this.state.name</code>'s value is not null.
  The showResult state check name's value is null or not, but this isn't work I guess.
  I don't know how to fix it.</p>
  
  <pre class="lang-js prettyprint-override"><code>import React, { Component } from 'react';
  class PhoneForm extends Component{
  state = {
      name : '',
      showResults : false
  }
  handleChange = (e) =&gt; {
      this.setState({
          name: e.target.value
      })
  }
  onClick=(e)=&gt;{
      this.setState({
          showResults: this.state.name===null ? false : true
      })
  }
  render(){
      return (
          &lt;form&gt;
              &lt;input
                  placeholder="name"
                  value={this.state.name}
                  onChange={this.handleChange}/&gt;
                  &lt;button onClick={this.onCkick}&gt;클릭!&lt;/button&gt;
                  &lt;div nameClass="showName" style={{display:(this.state.showResults? 'block':'none')}}&gt;{this.state.name}&lt;/div&gt;
          &lt;/form&gt;
      );
  }}
  
  
  export default PhoneForm;
  </code></pre>