Question

我正在使用indexeddb存储数据，并使用useReducer（）处理操作。

但是我不确定直接在react组件中调用异步函数是否正确。

谢谢

function Component({ dispatch }) {
  function pushToast() {
    const id = uniqid();
    dispatch({ type: "PUSH_TOAST", payload: { id, content: "success" } });
    setTimeout(() => dispatch({ type: "CLEAR_TOAST", payload: { id } }) , 3000);
  }
  async function getDocs() {
    try {
      const result = await idb.getDocs();
      dispatch({ type: "REQUEST_SUCCESS", payload: result });
      pushToast();
    } catch (error) {
      dispatch({ type: "REQUEST_FAIL" });
    }
  }
  return (
    <div>
      <button onClick={getDocs}></button>
    </div>
  );
}

Answer 1

是的。这在react组件中是可能的，但是您不能在构造函数内完成，因为构造函数无法等待等待。

Answer 2

在功能组件内部为onClick使用异步功能是完全可以的。

在react组件中直接调用异步函数合法吗？

2 个答案: