title: state in my react app get set to undefined
body: <p>Below is my code for a personal project where i can keep track of my monthly subscriptions, if i have to add a subscription i just have a add an object to an existing array. however for testing purposes when i tried to console.log(value.startDate) in handleSubmit it gives me undefined and causes further problems. How would i fix it?</p>
  <pre><code>import React from 'react';
  import PropTypes from 'prop-types';
  const List = () =&gt; {
      const [ mylist, setList ] = React.useState([]);
      const [ value, setValue ] = React.useState({ subscription: '', startDate: '', paymentTime: 0 });
      const handleSubmit = (e) =&gt; {
          console.log(value.startDate);
          setList(mylist.push(value));
          e.preventDefault();
      };
      const handleOnChange = (event) =&gt; {
          setValue({ [event.target.name]: event.target.value });
      };
      return (
          &lt;div&gt;
              &lt;div className=&quot;for_list&quot;&gt;
                  &lt;ul className=&quot;list&quot;&gt;{mylist.map((obj) =&gt; &lt;li key={obj.subscription}&gt;{obj.subscription}&lt;/li&gt;)}&lt;/ul&gt;
              &lt;/div&gt;
              &lt;div className=&quot;for_form&quot;&gt;
                  &lt;form&gt;
                      &lt;input type=&quot;text&quot; name=&quot;subscription&quot; onChange={handleOnChange} value={value.subscription} /&gt;
                      &lt;input type=&quot;text&quot; name=&quot;startDate&quot; onChange={handleOnChange} value={value.startDate} /&gt;
                      &lt;input type=&quot;number&quot; name=&quot;paymentTime&quot; onChange={handleOnChange} value={value.paymentTime} /&gt;
                  &lt;/form&gt;
              &lt;/div&gt;
              &lt;button onClick={handleSubmit}&gt;Add Item&lt;/button&gt;
          &lt;/div&gt;
      );
  };
  // it just removes the error above.
  List.propTypes = {
      list: PropTypes.node
  };
  export default List;
  </code></pre>