更新数组变量的状态

我想更改 setArray 的状态，但无法更改它。 console.log 显示空数组。其他州都在工作，但这个州不行 我也使用过 useEffect 但什么也没有发生。请给我一个解决方案。

import React from 'react';

import { Link} from 'react-router-dom'

import {useEffect} from 'react';

const Register = () =>{

   const classes = useStyle();
   const [name, setName] = React.useState('');
   const [password, setPassword] = React.useState('');
   const [array, setArray] = React.useState([])



   const submit = (event) =>{
       const obj = {}
       event.preventDefault();
       if(array.length === 0){
          localStorage.setItem('name', name);
          localStorage.setItem('password',password);
          localStorage.setItem('array',JSON.stringify(array))
          obj.id = Math.random();
          obj.name = localStorage.getItem('name');
          obj.password = localStorage.getItem('password');
          setArray(array => [...array,obj])
          console.log(array);
          return alert('You are registered'); 
       }
    }

 return(
    <div>
        <div className = {classes.formWrapper}>
            <Paper elevation={3} className = {classes.paper} >
            <Typography variant="h5" style = {{ textAlign : 'center'}}>Register</Typography>
            <form noValidate autoComplete="off">
                <TextField id="username" className={classes.textfield} style={{width : '95%'}} value = {name} name = "username"  label="Username" onChange = {e=>setName(e.target.value)} />
                <br />
                <TextField id="password" className={classes.textfield} style={{width : '95%'}} value = {password} name = "password"  label="Password" onChange = {e=>setPassword(e.target.value)} />
                <br />
                <br />
                <Link to='/'>SignIn</Link>
                <Button variant="contained" color="secondary" style = {{width : '100%'}} onClick = {submit} >Register </Button>
            </form>
            </Paper>
        </div>
    </div>

  )
}

export default Register;

澄清一下原因console.log(array);记录old数组是not因为setArray（或者更确切地说，它的实现）是或不是异步的。这是因为，简单地说，就是不可能的。 即使完全同步，情况仍然如此。

原因：

1. JavaScript 是一个值传递 https://stackoverflow.com/a/3638034（更确切地说共享呼叫），或更重要的是not a 引用传递语言。这意味着，绝对没有办法实现setArray以这样的方式它可以改变分配给的内容array。一个致命的泄露，你甚至不应该认为这是可能的，那就是array is a const.

2. 除了抛出异常之外，无法阻止其余代码的执行after setArray(array => [...array,obj]) from inside setArray.

另请注意，这不是反应事物。它只是语言的一部分。所以也没有办法fix这（并不是说我说需要修复）。

那么到底发生了什么？退出简单：

const submit = (event) => { ... }形成一个closure https://stackoverflow.com/q/111102超过常数array。因此console.log(array);必须引用该值。那setArray(array => [...array,obj]) stages的状态更新下一个渲染，以及该过程是同步还是异步，在这里完全无关。

那么如何引用一个changed状态变量？

1. use useEffect适当地。

2. 使用您想要指定为计算它的新状态的值。例如。：

   setArray(array => {
       const next = [...array, obj];
   
       console.log(next); // new value
   
       return next;
   });
   
   console.log(array); // *still* the old value, for the above mentioned reasons