设置自定义状态中的回调函数不起作用

Question

我正在尝试在 setCustomState 挂钩中使用回调函数，我通过 API 调用设置状态值，然后获取该值并使用它进行更多 API 调用，问题是名为 notTriggeredFunction、 的函数从未被调用，我不知道这里可能是什么问题。

我有如下：

  const [record, setRecord] = useState([])

myFunction=()=>{

        const ApiRes = await apicall()

        setRecord(ApiRes, () => {
              const arrayData = notTriggeredFunction(record) //does not get called
              
              if (arrayData.length > 0) {
                Promise.all(arrayData.map(e => fetchCurrent(e))).then(res =>
                  setRecord(
                    record => [...res, ...record],
                    () => resolve()
                  )
                )
              } else setLoading(false, () => resolve())
            })

}

我已经阅读了文档和其他问题，但似乎我可能在这里遗漏了某事。

Answer 1

setRecord state updater 函数只接受一个参数，要么是更新状态的值，要么是消耗前一个状态的函数，return 下一个状态值。传递给它的任何额外参数都将被忽略。

基于 class 的组件的 setState 回调的等效功能组件是更新状态并使用 useEffect 依赖于状态来发出副作用。这是 componentDidUpdate.

的同义词

更新 myFunction 回调中的 record 状态，并使用依赖于 record 状态更新的 useEffect 挂钩来发出额外的副作用。

const [record, setRecord] = useState([]);

myFunction = async () => {
  const ApiRes = await apicall();
  setRecord(ApiRes);
}

useEffect(() => {
  const arrayData = shouldBeTriggeredFunction(record);
          
  if (arrayData.length > 0) {
    Promise.all(arrayData.map(e => fetchCurrent(e)))
      .then(res => {
        setRecord(record => [...res, ...record]);
      });
  } else {
    setLoading(false);
  }
}, [record]);

但是，如果效果更新其依赖项数组中的相同状态，这将创建一个无限循环。您还必须添加一个额外的条件测试（该条件由您决定），或使用额外的状态依赖性，如 doFetchCurrent 或类似用作条件保护的东西，这样您就不会呈现循环。

设置自定义状态中的回调函数不起作用

calback function in setCustomState not working

callback

reactjs

react-hooks