Vue:如何在组件初始化过程中等待承诺?

你可以在路线上做。

const router = new VueRouter({
  routes: [
    {
      path: '/foo',
      component: Foo,
      beforeEnter: (to, from, next) => {
        doSomeRequests()
         .then(() => (next()))
      }
    }
  ]
})

doSomeRequests 是一个正在执行异步代码的函数。当异步代码完成时 然后你打电话 next() 允许Vue路由器输入与URL对应的组件。在示例中,组件 Foo

我的建议是在组件中显示加载程序。

<template>
  <!-- code  -->
    <LoaderComponent :loading="loading" />
  <!-- code  -->
</template>

剧本部分:

<script>
 export default {
   // code
   data: () => ({
    loading: false
   }),

   created () {
     this.loading = true
     doSomeRequests()
      .then(<!-- code  -->)
      .finally(() => (this.loading = false))
   }
 }
</script>