title: React Native screen does not update when object state changes
body: <p>I am using <code>react-native</code> to build my app.</p>
  <p>The main screen stores an object in the state:</p>
  <pre><code>const [menu, setMenu] = React.useState({name: &quot;Pizza&quot;, toppings: {chicken: 2}})
  </code></pre>
  <p>and I display this state to the user as:</p>
  <pre><code>&lt;Text&gt;Qty: {menu.toppings.chicken}&lt;/Text&gt;
  </code></pre>
  <p>I have a counter to update the state the loaginc to update the state is:</p>
  <pre><code>const handleChange = (action: string) =&gt; {
      if (action === 'add') {
        setMenu((prev) =&gt; {
          prev.toppings.chicken += 1
          return prev
        })
      } else if (action === 'subtract') {
        setMenu((prev) =&gt; {
          prev.calendar.booking -= 1
          return prev
        })
      }
  }
  </code></pre>
  <p>My function works correctly and changes the state to according to my needs(verified by console logging). However these changes are not reflexted in the <code>&lt;Text&gt;</code> where I am showing the quantity.</p>