更新state没有调用useEffct问题(使用setSatte强制state更新)
useEffect没有进行更新的原因
-
原因: 当我们每次调用
setState
时, 如果更新的状态跟上一次相同的, 就不会在setState
内部进行更新, 也不会进入useEffect
这个回调函数 -
示例代码: 在
setState
每次更新时, 不会进入useEffect这个函数
// ...
export default memo(function JMAppPlayerBar() {
// props/state
const [isPlaying, setIsPlaying] = useState(false) // 是否正在播放
// other
useEffect(() => {
// 只有第一次更新的时候才会调用useEffect
isPlaying && audioRef.current.play()
}, [isPlaying])
const changeSong = () => {
setIsPlaying(true)
}
return (
...
)
})
随机数
-
在我们每次更新
state
时, 只需要拼接随机数, 这样一定会调用useEffect
这个回调 -
示例代码
// ...
export default memo(function JMAppPlayerBar() {
// props/state
const [isPlaying, setIsPlaying] = useState(false) // 是否正在播放
// other
useEffect(() => {
// 每次更新的时候都会调用useEffect
isPlaying && audioRef.current.play()
}, [isPlaying])
// other handle
const changeSong = () => {
setIsPlaying(true + Math.random())
}
return (
...
)
})