确定所有状态变量都已设置答案

【问题标题】：Identify all state variables are set确定所有状态变量都已设置
【发布时间】：2023-02-03 00:34:53
【问题描述】：

我有 2 个带有状态变量“isApproved、setIsApproved”和“isPlayer、setIsPlayer”的复选框

在分配了这两个值之后，我需要执行一些操作，比如 getDetails(isApproved, isPlayer)

我知道是否设置了这两个状态变量的方法是使用 useEffect()

useEffect(()=>{
     getDetails(isApproved, isPlayer)
},[isApproved,isPlayer])

但问题是，每当用户单击复选框时，这些状态变量值之一会发生变化，并再次调用“getDetails”

我只想在设置这两个状态变量后第一次调用 getDetails

有什么建议吗？

【问题讨论】：

要实施“第一次”操作，通常将 FirstTime 标志初始化为 true，并在执行操作时将其重置。
谢谢道苏。即使我第一次使用标志说“isLoaded，setIsLoaded”，并在“isLoaded”上使用 Effect，这也是一个异步操作，我得到的结果不一致。

标签： reactjs react-native react-hooks

【解决方案1】：

在调用操作时使用 ref 进行切换，如果 ref 是 true 或初始值没有任何变化，则避免调用操作：

const initialIsApproved = false const initialIsPlayer = false

const Demo = () => {
  const [isApproved, setIsApproved] = useState(initialIsApproved)
  const [isPlayer, setIsPlayer] = useState(initialIsPlayer)
  
  const called = useRef(false)
  
  useEffect(() => {
    if(!called.current
       && isApproved !== initialIsApproved
       && isPlayer !== initialIsPlayer) {
      called.current = true
      getDetails(isApproved, isPlayer)
    }
  }, [isApproved, isPlayer])
  
  return (...)
}

【讨论】：