title: React hook useState not updating the UI when using JavaScript Date object on setState
body: <p>I have created a date object using React hook <code>useState</code> like this:</p>
  <pre><code>  const [selectedDate, setselectedDate] = useState(new Date());
  </code></pre>
  <p>I have a function that updates that object's day:</p>
  <pre><code>  const handleDayChange = (increment) =&gt; {
      let dateWillUpdate = selectedDate;
      date.setDate(selectedDate.getDate() + increment);
      setselectedDate(dateWillUpdate);
    };
  </code></pre>
  <p>The object is updated but the UI is not.
  So I tried another way which is to assign the date object like this:</p>
  <pre><code>let dateWillUpdate = {...selectedDate};
  </code></pre>
  <p>But this gives me an empty object:</p>
  <pre><code>object:{}
  </code></pre>
  <p>I am rendering the date with this function:</p>
  <pre><code>const renderDaySelector = () =&gt; {
      return (
        &lt;View style={styles.selector}&gt;
          &lt;View style={[styles.fieldContainer, { flex: 1 }]}&gt;
            &lt;TouchableOpacity onPress={() =&gt; handleDayChange(1)}&gt;
              &lt;MaterialCommunityIcons
                name=&quot;chevron-up&quot;
                color={Colors.primary}
                size={30}
              /&gt;
            &lt;/TouchableOpacity&gt;
            &lt;View style={[styles.field]}&gt;
              &lt;TextInput
                style={styles.textField}
                keyboardType=&quot;number-pad&quot;
                value={selectedDate.getDate().toString()}
              /&gt;
            &lt;/View&gt;
           ...
      );
    };
  </code></pre>
  <p>which I call in the main return of the function component:</p>
  <pre><code>return (
  ...
  
              &lt;View style={styles.values}&gt;{renderDaySelector()}&lt;/View&gt;
  
  
  ...
  )
  </code></pre>
  <p>How can I get the UI to update when calling the</p>
  <blockquote>
  <p>handleDayChange()</p>
  </blockquote>
  <p>function?
  Thanks.</p>