javascript - 我如何确保一个函数调用接一个发生

Question

在我的网络应用程序中，有两个 javascript 函数 submitJob 和 fetchJobs。我想在 submitJob 的末尾调用 fetchJob 以便用户可以看到已经创建了一个新作业(this.jobs 是连接到一些显示元素)。现在，数据库确实更新了，但是前端没有更新(除非我刷新网页)。我的 javascript 代码如下所示

submitJob: async function() {
  try {                                                                        
    let sel = document.getElementById('jobPriority')                           
    let priority = Number(sel.options[sel.selectedIndex].value);  
    let jobData = {'priority': priority, 'data': ''};                          
    let response = await axios.post('/api/jobs/', json=jobData,                
            {headers: {'Authorization': "Bearer " + this.token}});             
  } catch (error) { this.handleError(error); };                                
  this.fetchJobs();                                                     
},                                                                             
fetchJobs: async function() {                                           
  try {                                                                        
    let response = await axios.get('/api/jobs/',                               
            {headers: {'Authorization': "Bearer " + this.token}});             
    this.jobs = response.data;                                                 
  } catch (error) { this.handleError(error); };   
},

我怀疑 fetchJobs 在 axios.post 返回后没有被调用。我如何保证？我试图将 this.fetchJobs() 放在 try 语句中，但它也不起作用。

update: according to the server log, there was not a GET request. Only a successful POST request. Not sure why that is so.

预先感谢您的帮助!

Answer 1

您可以在 javascript 中使用 promise 和 async，如下所示

function resolveAfter2Seconds(x) {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve(x);
    }, 2000);
  });
}

async function add1(x) {
  var a = resolveAfter2Seconds(20);
  var b = resolveAfter2Seconds(30);
  return x + await a + await b;
}

add1(10).then(v => {
  console.log(v);  // prints 60 after 2 seconds.
});

async function add2(x) {
  var a = await resolveAfter2Seconds(20);
  var b = await resolveAfter2Seconds(30);
  return x + a + b;
}

add2(10).then(v => {
  console.log(v);  // prints 60 after 4 seconds.
});