React 中的异步操作应该依赖于重新渲染吗？

Question

我应该依赖useEffect还是componentDidUpdate执行异步操作，而不是在可能的情况下直接对用户事件做出反应？假设我需要在用户单击按钮时发送 API 请求，我是否应该强制重新渲染然后发送请求？或者我可以在用户点击时发送请求吗？const [hasClicked, setClicked] = useState(false)const [data, setData] = useState({})useEffect(  async function fetchSomething() {    const fetchedData = await API.getData()    setData(fetchedData)  }  fetchSomething(), [hasClicked])return (<div>  {data.id && <span>{data.id}</span>}  <button onClick={() => setClicked(true)}>Click me</button></div>)对比const [data, setData] = useState(null)async function fetchSomething() {  const fetchedData = await API.getData()  setData(fetchedData)}return (<div>  {data.id && <span>{data.id}</span>}  <button onClick={fetchSomething}>Click me</button></div>)（假设loading状态是在外部处理的，并且当数据获取已经开始一次时按钮被禁用）编辑：我们不想跟踪状态，但是我们看到了这些文章，其中 Dan 建议回调是事件处理程序在内部处理 useEffecthttps://overreacted.io/a-complete-guide-to-useeffect/#speaking-of-race-conditionshttps://github.com/facebook/react/issues/14326#issuecomment-472043812

Answer 1

如果您需要跟踪用户单击按钮的时间，我只会使用第一个示例。

您不需要使用状态来调用异步函数。

如果您不打算hasClicked在其他任何地方使用，那么只需使用您的第二个示例。