如何让语句等到上一个函数完成？

Question

我遇到了一个问题，window.open 被调用得太快，我的其他函数没有完成并且 post 在我的 onclick 函数中及时。

我尝试在 trackData() 上设置超时，但它只是偶尔有效，我不想设置更长的超时。

点击

   {() => {
       trackData();
       window.open("https:google.com", "_self");
    })

有什么想法吗？

编辑：以下内容在本地有效，但在生产时不进行跟踪。如果 "_self" 被替换为 "_blank"（不可能）

，则跟踪每次都有效

  let postData = async(value) => {
       await tracker({
            action: value,
        })
    }

tracker 只是用 action

生成了一个 axios post

   <div
       className="exampleBTN"
       onClick={() =>  {
       postData("example").then(                         
       window.open("https://google.com", 
       "_self")
       )}
    }
    >
   </div>

在本地，我可以看到数据进入数据库。

但是，在线它不起作用。它仅在以下任何一个为真时才有效：

在 onClick
没有“_self”但有“_blank”所以它在新标签页中打开

我认为我的 async 是错误的，所以我也尝试了以下操作：

 onClick={async () =>  {
 await postData("example").then(                            
 window.open("google.com", "_self"))
 }}

Answer 1

您可以使用基于承诺的方法 here.use aysnc 和 await。

async function trackData(){
 ..... 
   let data = awiat your code 
.....
}

带有 promise 的函数调用

trackData().then(res=>{
  if(res ==="Success){
 window.open("https:google.com", "_self")
}
})

Answer 2

您可以使用 .then 或 async/await 在操作结果为 Promise 时执行此操作。 Axios 请求 return 承诺。

initiateAsynchronousAction()
  .then(result => console.log(result))

.then 函数内的回调只有在异步函数执行的操作实现承诺时才会执行。

小说明：请注意，在 .then() 中，您必须传递一个回调函数，而不是立即调用您想要执行的操作，即使您不打算使用结果值。所以它会是 .then(result=> console.log('Inside callback!'))

和不 .then(console.log('Inside callback!'))

Async-await 是另一种写法，它只是语法糖，只是一种更简单的写法：

const foo = async () => {
  const result = await initiateAsynchronousAction()
  console.log(result)
}

变量 result 只有在 Promise 被 resolve 后才会被赋值。即等待赋值。

您可以在第一种情况下链接 .catch 或将任务封装在 try-catch 块中以在 Axios 承诺未实现时捕获错误。

如何让语句等到上一个函数完成？

How can I make a statement wait until a previous function is finished?

javascript

onclick

reactjs