title: i cant change state of setArray. i could change the states of other usestates but not this
body: <pre><code>import React from 'react';
  
  import { Paper, Typography, TextField , Button, makeStyles} from '@material-ui/core';
  
  import {useHistory, Link} from 'react-router-dom'
  
  import {useEffect} from 'react';
  
  const Register = () =&gt;{
  
      const classes = useStyle();
      const history = useHistory();
      const [name, setName] = React.useState('');
      const [password, setPassword] = React.useState('');
      const [array, setArray] = React.useState([])
  
      // useEffect(()=&gt;{
          
      //     const jsonArray = JSON.stringify(arr)
      //     localStorage.setItem('array',jsonArray)
      // },[arr])
  
      const submit = (event) =&gt;{
          event.preventDefault();
          
          if(array.length === 0){
              const obj = {};
              localStorage.setItem('name', name);
              localStorage.setItem('password',password);
              localStorage.setItem('array',array)
              obj.id = Math.random();
              obj.name = localStorage.getItem('name');
              obj.password = localStorage.getItem('password');
              setName('');
              setPassword('')
              setArray([...array,obj])
              return alert('You are registered'); 
          }
          
         
  
      }
  
      return(
          &lt;div&gt;
              &lt;div className = {classes.formWrapper}&gt;
                  &lt;Paper elevation={3} className = {classes.paper} &gt;
                  &lt;Typography variant=&quot;h5&quot; style = {{ textAlign : 'center'}}&gt;Register&lt;/Typography&gt;
                  &lt;form noValidate autoComplete=&quot;off&quot;&gt;
                      &lt;TextField id=&quot;username&quot; className={classes.textfield} style={{width : '95%'}} value = {name} name = &quot;username&quot;  label=&quot;Username&quot; onChange = {e=&gt;setName(e.target.value)} /&gt;
                      &lt;br /&gt;
                      &lt;TextField id=&quot;password&quot; className={classes.textfield} style={{width : '95%'}} value = {password} name = &quot;password&quot;  label=&quot;Password&quot; onChange = {e=&gt;setPassword(e.target.value)} /&gt;
                      &lt;br /&gt;
                      &lt;br /&gt;
                      &lt;Link to='/'&gt;SignIn&lt;/Link&gt;
                      &lt;Button variant=&quot;contained&quot; color=&quot;secondary&quot; style = {{width : '100%'}} onClick = {submit} &gt;Register &lt;/Button&gt;
                  &lt;/form&gt;
                  &lt;/Paper&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      
      )
  }
  
  export default Register;
  </code></pre>