等待一个函数完成，在下一个函数执行之前答案

【问题标题】：Wait for a function to finish, before the next one executes等待一个函数完成，在下一个函数执行之前
【发布时间】：2021-09-21 23:37:10
【问题描述】：

我有一个反应应用程序。当用户登顶表单时，我想打开一个模式，并将用户响应存储在状态中。基于此响应，我想执行一些业务逻辑，然后发布表单。

这是我的 onsubmit 方法

      async function onSubmit(submission: IPayload) {
        await handleModal();
        await submit(submission);
      }
    
      async function submit(submission: ICreateAdPayload) {
          await api.create({ this is where all the props go})
      }

     // Heres I set the state of the modal to open, which then chanes the open prop on another component for the modal to open.

      async function handleModal(submission: any) {
        setShowModal(true);
    
        // handle logic

        setShowModal(false);
  }

但是，一旦模式打开，我的提交功能就会执行。有什么想法吗？

【问题讨论】：

// handle logic 中的任何代码都需要修改以创建承诺，然后您需要等待该承诺。在不知道该代码是什么的情况下，我无法说得更具体。

标签： javascript reactjs async-await

【解决方案1】：

为了能够await handleModal(...)，那么该方法必须返回一个Promise，当它的工作完成时你resolve - 假设它本身不需要await任何东西，它不需要标记@ 987654325@

function handleModal(submission: any) {
    setShowModal(true);

    return new Promise(resolve => {
        // handle logic 

        setShowModal(false);

        resolve();
    });
}

【讨论】：