在继续显示组件之前等待 API 调用答案

【问题标题】：Waiting for API call before proceeding to display component在继续显示组件之前等待 API 调用
【发布时间】：2019-05-28 14:20:02
【问题描述】：

我正在使用 axios 进行 API 调用。当鼠标进入页面上的某些 HTML 元素时，调用发生。通常，在第一次悬停时没有收到任何数据，但在第二次悬停时通常会出现数据。我认为这是因为我没有等待 API 调用返回。有没有办法实现这个？

下面是我用来进行 API 调用的 Axios 实例。

感谢您的时间和考虑。

instance
.get('observations?patientId=37')
.then((response) => {
   this.clinicaltabs[0].title = response.data.data;
});

【问题讨论】：

您能否提供更多代码，以便我们尝试找出可以改进的地方？目前，我没有发现任何问题。

标签： vue.js callback axios

【解决方案1】：

我会做什么：

使用微调器加载可悬停的 HTML 元素，并在发送请求时使其可见。

this.loading = true; //Some way for disabling the hover event

instance
.get('observations?patientId=37')
.then((response) => {
   this.clinicaltabs[0].title = response.data.data;
})
.finally(() => this.loading = false);

然后您可以使用v-if="loading" 或类似的东西来控制组件的显示，直到它加载为止。

【讨论】：