title: How to pass a React Hook to a child component
body: <p>I want to pass the setter of a React Hook to a Child Component. So that a button in the child component updates the state via setter which is saved in the Parent Component. I tried following setup but I get an error message : </p>
  
  <blockquote>
    <p>TypeError: setshowOptionPC is not a function
    onClick</p>
  </blockquote>
  
  <p>Is my approach even possible? And if not how could I possibly do that structure using a React Hook.</p>
  
  <p>Below a simplified version of my code:</p>
  
  <pre><code>import React, { useState } from "react";
  
  function ChildComponent({ setshowChildOptionBC, setshowChildOptionPC }) (
    &lt;div&gt;
      &lt;button
        onClick={() =&gt; {
          setshowChildOptionPC(false);
          setshowChildOptionBC(true);
        }}
      &gt;
        BC
      &lt;/button&gt;
      &lt;button
        onClick={() =&gt; {
          setshowChildOptionPC(true);
          setshowChildOptionBC(false);
        }}
      &gt;
        PC
      &lt;/button&gt;
    &lt;/div&gt;
  );
  
  
  function ParentComponent() {
    const [showOptionBC, setshowOptionBC] = useState(true);
    const [showOptionPC, setshowOptionPC] = useState(false);
  
    return (
      &lt;div&gt;
        &lt;ChildComponent
          setshowChildOptionBC={setshowOptionBC}
          setshowChildOptionPC={setshowOptionPC}
        /&gt;
        {showOptionBC &amp;&amp; &lt;div&gt;BC&lt;/div&gt;}
        {showOptionPC &amp;&amp; &lt;div&gt;PC&lt;/div&gt;}
      &lt;/div&gt;
    );
  }
  
  export default ParentComponent;
  </code></pre>