React - 运行 useEffect 和元素点击的函数？

Question

我在 useEffect 挂钩中有一个函数向我的服务器请求一些数据：

useEffect(() => {
  const reqFn = async () => {
    // req code...
    setState(req result)
  }
  return reqfn()
},[setState])

此外，当用户单击按钮请求不同的数据时，我需要运行此函数（reqFn 使用 useState 值作为服务器请求的道具）。

我试过将 reqFn() 放在 useEffect 之外，但这会使运行ning reqFn 陷入循环。我怎样才能做到这一点？

Answer 1

正如我从你的问题中看到的那样，你需要在第一次渲染中使用 api 数据，然后你只需单击即可处理更新。所以你可以在没有状态回调的情况下使用 useEffect 并使用 onClick

处理其余的

const reqFn = async () => {
    // req code...
    setState(req result)
}

useEffect(() => {
  reqfn()
},[])

<>
...
//Rest of your component
<button onClick={reqFn}>Click</button>
...
</>

React - 运行 useEffect 和元素点击的函数？

React - Run a function on useEffect and on element click?

javascript

reactjs

react-hooks

use-effect