功能组件的setState中的prevState到底是什么？

Question

从setState挂钩获得的useState内返回（然后改变）以前的状态似乎并没有改变状态。运行以下直接代码段

function App()
  const [state, setState] = React.useState([x: 0])
  function changeCount()
    setState(prevState => 
      console.log('before', prevState[0])
      const newState = [...prevState]
      newState[0].x += 1 //the shallow copy newState could potentially change state
      console.log('after', prevState[0])//here x gets bigger as expected
      return prevState //instead of newState we return the changed prevState
    )
  
  //checking state shows that x remained 0
  return <div className='square' onClick=changeCount>state[0].x</div>

ReactDOM.render(<App/>, document.getElementById('root'))

.square
  width: 100px;
  height: 100px;
  background: orange;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.6/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.6/umd/react-dom.production.min.js"></script>
<div id='root'></div>

通过单击正方形，我们触发setState。在setState中，我们复制了先前状态的浅表newState。通过更改副本，我们在控制台确认时更改了prevState（可能是无意的）。但是，返回更改后的先前状态形式setState不会更改状态，因为计数仍为0。如果我们要返回newState，则行为将与预期的一样。

重复此操作，表明prevState变大，似乎不再代表以前的状态。

为什么？我在codepen ...上做了这个最小的例子。

返回一个从useState挂钩获得的setState中的先前状态，然后（更改）它似乎并没有改变状态。运行以下直接代码段功能App（）const [...