React hooks,使用useState改变了state后，子组件调用父组件的,state仍是旧值

Question

如下图，父组件中调用playOrStop将startAudio变为true后，子组件再调用playOrStop这个方法，console出的startAudio仍为false。如果先在子组件中调用再在父组件中调用没问题，或者前后两次都在父组件中调用也没问题,求大神指点迷津。

子组件

console

Answer 1

let [startAudio,setStartAudio] = useState(false);

• 对通过setStartAudio来更新state是异步的，非同步。所以在调用方法后看到的就是旧值
• 可通过 useEffec来checek值的变化
• 回调函数最好通过useCallback Hook来缓存，避免子组件的不必要渲染