React 延迟一段时间后如何检查状态并执行函数？

Question

如果状态没有改变（由于数据库获取而更新），我正在尝试执行一个函数。我的意思是：

const [value, setValue] = useState(false)
const func = () => {
  ...
}

setTimeout(()=>{
  if(value) {
     func()
  } else {
    Alert.alert("Nothing!")
  }
},20000)

fetchData.then(()=>setValue(true))

但是这个超时方法采用 const

value

的初始状态，并根据其初始值执行，而不是根据 20 秒后的值执行。即使更新到

true

。

如何才能达到这个目标？

Answer 1

使用

useEffect

尝试如下所示的操作。

const [value, setValue] = useState(false)

const func = () => {
  ...
}

useEffect(() => {
  setTimeout(()=>{
    if(value) {
       func()
    } else {
      Alert.alert("Nothing!")
    }
  },20000)
}, [value])

useEffect(() => {
  fetchData.then(()=>setValue(true))
}, [])