1.21 状态队列与自动批处理

一、状态队列与自动批处理

1. React会等到时间处理函数中的所有代码都运行完毕再处理你的state更新。队列都执行完毕后，在进行UI更新，这种也行就是自动批处理

2. 更新函数的写法：

   import { useState } from 'react'
   
   function App() {
     const [count, setCount] = useState(0)
     const handleClick = () => {
       setCount((c) => {
         return c + 1
       })
     }
   
     return (
       <>
         <div>Default Template</div>
         <button onClick={handleClick}>点击</button>
         {count}
       </>
     )
   }
   
   export default App
   

   这时候如果将更新函数写三遍，那么形参c会发生变化，因为形参不受快照影响，因此如果将更新函数赋值三边页面会输出3，但此次快照的数值不受影响

   1. setState(x)实际上会像setStatus(n => x)一样运行，只是没有n！