title: React JS change a value with a button
body: <p>I need something particular to be shown in a modal depending on which button is pressed.
  As you can see I have 2 IonButtons, when pressed modifies setShowModal ({isOpen: true}), that is, isOpen is true. But I also have to modify, by pressing IonButton the value of state.count</p>
  <p>How can I do this?</p>
  <p>As you can see in the event onClick = {() =&gt; setShowModal ({isOpen: true}), state.count = 0}
  I have tried modifying the value of state.count but I have a code error</p>
  <pre><code>const App = () =&gt; {
    const [showModal, setShowModal] = useState({ isOpen: false });
    const [retVal, setRetVal] = useState(null);
    const state = {
      count: 0
    };
  
  
    return (
      &lt;IonApp&gt;
        &lt;IonPage&gt;
          &lt;IonHeader&gt;
            &lt;IonToolbar&gt;
              &lt;IonButton
                onClick={() =&gt; setShowModal({ isOpen: true }), state.count=0}
                slot=&quot;end&quot;
               
              &gt;
                OPEN MODAL 1
              &lt;/IonButton&gt;
              &lt;IonButton
                onClick={() =&gt; setShowModal({ isOpen: true }), state.count=1}
                slot=&quot;end&quot;
              &gt;
                OPEN MODAL 2
              &lt;/IonButton&gt;
              &lt;IonTitle&gt;MODAL TEST&lt;/IonTitle&gt;
            &lt;/IonToolbar&gt;
          &lt;/IonHeader&gt;
          &lt;IonContent className=&quot;ion-padding&quot;&gt;
            &lt;IonModal
              animated={true}
              isOpen={showModal.isOpen}
              onDidDismiss={() =&gt; setShowModal({ isOpen: false })}
            &gt;
              &lt;MyModal tipo={0}
                onClose={(value) =&gt; {
                  setShowModal({ isOpen: false });
                  value ? setRetVal(value) : setRetVal(&quot;User Cancelled&quot;);
                }}
              /&gt;
            &lt;/IonModal&gt;
            &lt;h2&gt;Test Modal&lt;/h2&gt;
            &lt;li&gt;Modal in seperate component&lt;/li&gt;
            &lt;li&gt;Modal with List&lt;/li&gt;
            &lt;li&gt;Modal That Scrolls&lt;/li&gt;
            &lt;li&gt;Modal That returns Value When Clicked&lt;/li&gt;
            &lt;div&gt;
              &lt;h3&gt;RETURNED VALUE&lt;/h3&gt;
              &lt;p&gt;{retVal}&lt;/p&gt;
            &lt;/div&gt;
          &lt;/IonContent&gt;
        &lt;/IonPage&gt;
      &lt;/IonApp&gt;
    );
  };
  
  export default App;
  
  const MyModal = ({ onClose }, {any:tipo}) =&gt; {
    const data = Array(100).fill(&quot;TEST&quot;);
    if(tipo===0){
      return (
        &lt;&gt;
          &lt;IonHeader&gt;
            &lt;IonToolbar&gt;
              &lt;IonButton onClick={() =&gt; onClose(null)} slot=&quot;end&quot;&gt;
                CLOSE MODAL
              &lt;/IonButton&gt;
            &lt;/IonToolbar&gt;
          &lt;/IonHeader&gt;
          &lt;IonContent&gt;
            &lt;div id=&quot;contenedor-central&quot;&gt;
              &lt;strong&gt;Usuario no registrado&lt;/strong&gt;
            &lt;/div&gt;
            &lt;IonButton href=&quot;/registro&quot;&gt;Registrarse&lt;/IonButton&gt;
            &lt;IonItem&gt;Click List Item To Return Selected Value&lt;/IonItem&gt;
            &lt;IonList&gt;
              {data.map((e, i) =&gt; {
                return &lt;IonItem onClick={() =&gt; onClose(i)}&gt;{e + i}&lt;/IonItem&gt;;
              })}
            &lt;/IonList&gt;
          &lt;/IonContent&gt;
        &lt;/&gt;
      );
    }
  
    if(tipo===1){
      return (
        &lt;&gt;
          &lt;IonHeader&gt;
            &lt;IonToolbar&gt;
              &lt;IonButton onClick={() =&gt; onClose(null)} slot=&quot;end&quot;&gt;
                CLOSE MODAL
              &lt;/IonButton&gt;
            &lt;/IonToolbar&gt;
          &lt;/IonHeader&gt;
          &lt;IonContent&gt;
            &lt;div id=&quot;contenedor-central&quot;&gt;
              &lt;strong&gt;Tipo 2&lt;/strong&gt;
            &lt;/div&gt;
            &lt;IonButton href=&quot;/registro&quot;&gt;Registrarse&lt;/IonButton&gt;
            &lt;IonItem&gt;Click List Item To Return Selected Value&lt;/IonItem&gt;
            &lt;IonList&gt;
              {data.map((e, i) =&gt; {
                return &lt;IonItem onClick={() =&gt; onClose(i)}&gt;{e + i}&lt;/IonItem&gt;;
              })}
            &lt;/IonList&gt;
          &lt;/IonContent&gt;
        &lt;/&gt;
      );
    }
    
  };
  </code></pre>