title: React with Fluent UI Form onChange not working (very simple code)
body: <p>I am using <strong>React</strong> with <strong>FluentUI</strong> to build a simple form, code is following</p>
  <pre class="lang-js prettyprint-override"><code>import React, { useState, FormEvent } from &quot;react&quot;;
  
  import { PrimaryButton } from &quot;office-ui-fabric-react/lib/Button&quot;;
  
  import { IUserFormValues } from &quot;../../models/user&quot;;
  import { Stack, TextField } from &quot;@fluentui/react&quot;;
  
  const NewUIForm = () =&gt; {
    const [user, setUser] = useState&lt;IUserFormValues&gt;({
      email: &quot;&quot;,
      password: &quot;&quot;,
    });
  
    const handleInputChange = (
      event: FormEvent&lt;HTMLInputElement | HTMLTextAreaElement&gt;
    ) =&gt; {
      const { name, value } = event.currentTarget;
      setUser({ ...user, [name]: value });
    };
  
    const log123 = () =&gt; {
      console.log(user.email);
    };
  
    return (
      &lt;Stack&gt;
        &lt;Stack&gt;
          &lt;Stack.Item grow&gt;
            &lt;TextField
              placeholder=&quot;UserName&quot;
              label=&quot;User Name&quot;
              value={user.email}
              name=&quot;email&quot;
              onChange={handleInputChange}
            /&gt;
            &lt;TextField
              placeholder=&quot;Password&quot;
              label=&quot;Password&quot;
              value={user.password}
              name=&quot;password&quot;
              onChange={handleInputChange}
            /&gt;
          &lt;/Stack.Item&gt;
          &lt;PrimaryButton onClick={log123}&gt;Add&lt;/PrimaryButton&gt;
        &lt;/Stack&gt;
      &lt;/Stack&gt;
    );
  };
  export default NewUIForm;
  </code></pre>
  <p>every time when I type something in the TextField I will get this error</p>
  <blockquote>
  <p>TypeError: Cannot destructure property 'name' of 'event.currentTarget' as it is null.</p>
  </blockquote>
  <p>Can someone help me? Thanks!!</p>