Question

我是 Vue.js 生态系统的新手，需要一些建议。

我使用GET request包制作了axios。我想显示预加载器的整页，直到所有数据都来了。我认为这项任务并不新鲜，但我想了解Vue.js中通常是如何完成这些事情的。

对于预加载器，我创建了新组件。我有点困惑。如何在另一个时间从另一个组件调用该组件并使之可见。

Answer 1

您可以在axios all和spread（以进行所有请求）之前显示您的预加载用户界面，并在then之前隐藏该预加载用户界面。例如：

// show preload ui
showSpinnerAnimation();

// Requests will be executed in parallel...
axios.all([
  axios.get('https://somelink');
  axios.get('https://someotherlink')
])
.then(axios.spread(function (somelinkResponse, someotherlinkResponse) {
  //... but this callback will be executed only when both requests are complete.
  console.log('somelinkResponse', somelinkResponse.data);
  console.log('someotherlinkResponse', someotherlinkResponse.data);

  // hide preload ui
  hideSpinnerAnimation();
}));

Answer 2

Axios与Ajax的工作方式不同。您可以说是javascript ajax函数的高级版本。

axios的小示例：

Coords{x=0, x=1}
Coords{x=0, x=2}
Coords{x=0, x=3}
Coords{x=0, x=4}
Coords{x=1, x=2}
Coords{x=1, x=3}
Coords{x=1, x=4}
Coords{x=2, x=3}
Coords{x=2, x=4}
...

参考： https://github.com/axios/axios

Vue.js应用程序中的预加载器？

2 个答案: