title: how to hide component is react and show another component?
body: <p>could you please tell me how to hide the component in reactJS and show another component?I have one button and text (<code>hello</code>).on button click, I want to hide button as well as text and show another text <code>bye</code>
  here is my code
  <a href="https://codesandbox.io/s/50lj63xvk" rel="nofollow noreferrer">https://codesandbox.io/s/50lj63xvk</a></p>
  
  <pre><code>showBankDetail = () =&gt; {
      console.log("====");
      this.setState({
        validForm: true
      });
    };
    render() {
      const validForm = !this.state.validForm;
      return { validForm } ? (
        &lt;div&gt;
          heloo&lt;button onClick={this.showBankDetail}&gt;hide&lt;/button&gt;
        &lt;/div&gt;
      ) : (
        &lt;div&gt;bye&lt;/div&gt;
      );
    }
  </code></pre>