axios 如何暂停promise链以等待按钮点击？

xqk2d5yq 于 2023-10-18 发布在 iOS

关注(0)|答案(1)|浏览(141)

我试图链接一些后端调用来处理一个文件，但整个工作流需要用户中途的一些输入。我不知道如何暂停执行，直到用户在使用一个模态后单击一个按钮“Continue“。
所以过程如下：
1.用户选择触发事件的文件以上传一些数据。
1.我从上一个调用中得到响应，打开一个带有表单的模态。我需要暂停一下。
1.填写表单，点击“Continue“按钮恢复promise链。
1.触发另一个调用以向另一个端点提交更多信息。
因此，这些步骤中的每一个都与使用axios的HTTP请求相关，但我很难理解如何链接promise。
现在我有这样的东西：

onFileSelected(event) {
  // code here
  axios
    .post("")
    .then((res) => {
      // Here I need to open the modal, and wait for the button click
    })
    .then(() => {
      anotherMethod();
    });
}

axios

来源：https://stackoverflow.com/questions/76902588/how-to-pause-promise-chain-to-wait-for-a-button-click

1条答案

按热度按时间

ffscu2ro1#

Promises本身并不提供暂停执行的方法，但是你可以使用async/await语法来实现。创建一个自定义promise，当用户单击“Continue”按钮时进行解析。像这样的

async function onFileSelected(event) {
  try {
    const response = await axios.post("") // Upload data
    await showModalAndWaitForUserInteraction() // Pause and wait for user input

    await anotherMethod() // Continue after user interaction

    // Continue with the rest of your promise chain
    const anotherResponse = await axios.post("") // Submit more info to another endpoint
    // ...
  } catch (error) {
    // Handle errors here
  }
}

function showModalAndWaitForUserInteraction() {
  return new Promise((resolve) => {
    // Show the modal with button
    // ...modal logic
    // then resolve() 
  })
}

赞(0）回复(0）举报 2023-10-18

我来回答

axios 如何暂停promise链以等待按钮点击？

1条答案

相关问题

热门标签

最新问答