Vuejs上的回调函数

Question

我正在尝试使流程以同步方式运行。 但是，由于我具有自然异步的ajax调用，因此遇到了问题，因为仅在调用数组后才填充我的数组。 为了解决这个问题，我正在尝试做一个回调函数。 但是我没有成功。

这是我的代码：

（点击操作会调用此函数）：

VmUser.executa(user,this.addTodos)

调用的功能：

executa(user, callback) {       
  this.montaTodos(user, { complete: callback })
},

addTodos() {
  const VmUser = this           
  VmUser.details = VmUser.todos.map(user => {
    VmUser.$bus.$emit('add-user', { user: user })
  })
},

montaTodos(user) {
  const VmUser = this 
  axios
    .get(`api/gethierarquia/${user.cod_usuario}`)
    .then(res => {
      if (res.data.usuarios.length !== 0){
        //VmUser.$bus.$emit('add-user', { user: user})
        VmUser.todos.push(user)
        VmUser.supervisores = res.data.usuarios
        VmUser.details = VmUser.supervisores.map(user => {
          VmUser.todos.push(user)
          axios
            .get(`api/gethierarquia/${user.cod_usuario}`)
            .then(res => {
              if (res.data.usuarios.length !== 0){
                VmUser.funcionarios = res.data.usuarios
                VmUser.details = VmUser.funcionarios.map(user => {
                  VmUser.todos.push(user)
                })  
              }
            })
        })
      }
    })
},

Answer 1

您可以使用Promise等到异步请求完成addTodos调用addTodos方法。

我不确定为什么您要向api/gethierarquia发出两个请求。 但是，我认为您的情况如下所示：

executa(user, callback) {       
  this.montaTodos(user).then((response) => {
    this.addTodos; // gets here when the promise is resolved
  }, (error) => {
    console.error(error); // gets here when the promise is rejected
  });
},

montaTodos(user) {
  return new Promise((resolve, reject) => {
    axios
      .get(`api/gethierarquia/${user.cod_usuario}`)
      .then((response) => {
        // logic to handle response

        resolve(response); // the request was successfull
      })
      .catch((error) => {
        reject(error); // the request failed
      });
  });
},