如何使语句等待上一个函数完成

Question

我遇到了一个问题，window.open被调用得太快，而我的另一个函数没有在我的onclick函数中及时完成和发布。

我试着在trackData()上设置一个超时，但它只在偶尔起作用，我不想设置更长的超时。

onClick

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

有什么想法吗？

编辑：以下在本地工作，但在生产时不跟踪。如果"_self"被"_blank"(不能是(取代，跟踪始终有效

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

追踪器只是用动作做了一个axios帖子

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

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

然而，在网上它不起作用。只有当这两者中的任何一个为真时，它才有效：

• 没有窗口。打开onClick
• 没有"_自我；但是"_空白"；所以它在一个新的选项卡中打开

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

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

Answer 1

当操作产生Promise时，您可以使用.then或async/await来执行此操作。Axios请求返回Promises。

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

只有当异步函数执行的操作实现了promise时，才会执行.then函数内部的回调。

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

而不是.then(console.log('Inside callback!'))

异步等待是另一种编写方法，它只是语法糖，这只是一种更容易的编写方法：

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

只有在Promise被解析后，变量result才会被赋予该值。也就是说，将等待赋值。

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

Answer 2

您可以在此处使用基于承诺的方法。请使用aysnc和await。

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

带有promise 的函数调用

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