Javascript Vue.js预填充数据

我有一个包含多个combobox的表单，combobox是从REST服务中填充的，但我的问题是工作模型是在combobox所需的任何数据之前加载的，因此combobox从未设置为正确的值

只有在load dropdown回调函数中设置load model，我才能使其工作，但这看起来很混乱，如果有多个下拉菜单，则无法工作

如何在vue中解决这个问题

这是剧本

var-app=新的Vue({
el:'类别编辑'，
数据：{
类别：{}，
类别：[]
},
方法：{
getCategory:函数（categoryId）{
常量配置={
标题：{
“授权”：“持票人”+“@token”
}
};
get（'/api/categories/'+categoryId，config）
.然后（功能（响应）{
app.category=response.data；
控制台日志（应用程序类别）；
})
.catch（函数（错误）{
警报（错误）；
console.log（错误）；
});
},
添加：函数（）{
常量配置={
标题：{
“授权”：“持票人”+“@token”
}
};
post（'/api/categories/save'，app.author，config）；
},
fetchCategories:function（）{
变量配置={
标题：{
“授权”：“持票人”+“@token”
}
}
get（'/api/categories/all'，config）
.然后（功能（响应）{
app.categories=response.data；
})
.catch（函数（错误）{
警报（错误）
console.log（错误）；
});
}
},
挂载：函数（）{
this.fetchCategories（）；
this.getCategory（'@ViewContext.routedData.Values[“id”]'）；
}
})

这是HTML

卡特戈里亚
{{cat.Name}

在加载所有类别后尝试加载类别：

mounted: function() {
  this.fetchCategories()
    .then(() => {
      this.getCategory('@ViewContext.RouteData.Values["id"]')
    })
}

为此，请确保

fetchCategories

返回承诺：

fetchCategories: function() {
  var config = {
    headers: {
      'Authorization': 'Bearer ' + '@token'
    }
  }

  return axios.get('/api/categories/all', config)
    .then(response => {
      this.categories = response.data;
    })
    .catch(error => {
      alert(error)
      console.log(error);
    });
}

---

另外，最好将所有数据绑定到此对象，您不想让应用程序代码知道如何命名Vue实例变量。

如果有多个下拉列表，该怎么办？我认为您可以在回调中加载多个下拉列表的数据，就像加载单个下拉列表一样，或者电话会被一个接一个的下拉列表链接？这取决于你想要的方式。您也可以将它们链接起来，只需让getCategory返回承诺也（

return axios.get（…）

）然后

this.getCategory（1）。然后（（）=>this.getCategory（2））

，等等。