Typescript 如何在Vue+；中渲染之前等待组件中的数据；打字稿

在第一个组件中，我使用路由器打开新页面
组件\u 1.vue:

let route = this.$router.resolve({ name: 'Schedule', params : { id: (this.schedule[0].schedule_id).toString() } });
window.open(route.href, '_blank');

import Vue from "vue";
import Router from "vue-router";
import SchedulePage from "./views/SchedulePage.vue"

Vue.use(Router);

export default new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
      // here is other routes
    },
    {
      path: "/schedule/:id",
      name: "Schedule",
      component: SchedulePage,
    },
  ]
});

路由器。ts:

let route = this.$router.resolve({ name: 'Schedule', params : { id: (this.schedule[0].schedule_id).toString() } });
window.open(route.href, '_blank');

import Vue from "vue";
import Router from "vue-router";
import SchedulePage from "./views/SchedulePage.vue"

Vue.use(Router);

export default new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
      // here is other routes
    },
    {
      path: "/schedule/:id",
      name: "Schedule",
      component: SchedulePage,
    },
  ]
});

SchedulePage.vue

此组件在

调度

从异步函数获取之前呈现。 如何解决这个问题？是的，我读过，但我不明白如何从

created（）

或

getSchedule（）

从“@/store”导入存储
从“Vue”导入Vue；
从“../components/ScheduleTable.vue”导入ScheduleTable；
从“vue类组件”导入组件；
从“@/interfaces”导入{isSchedule}；
从“@/api”导入*作为api；
导出默认Vue.extend({
组成部分：{
可调度的，
},
数据（）{
返回{
附表：{}
}
},
方法：{
getSchedule:异步函数（）{
this.schedule=wait api.getScheduleById（this.$route.params.id）；
}
},
异步创建（）{
等待此消息。getSchedule（）；
}
});

谢谢Phill的帮助。我错了

<schedule-table
    v-if = "schedule.length > 0"
    :exercises="schedule.exercises"
/>

schedule

不是数组，而是对象。 最好使用这样的工具

object.entries（schedule）.length！=0

---

您的v-if应该类似于

v-if=“Object.keys（schedule）.length”

。除此之外，为什么即使您还没有数据，渲染组件也会有问题？像你那样放一个v-if对我来说很好。@Phil如果组件为空，那么其中的方法将出现错误。此组件应仅显示在data@Phil你说得对，我不该用这种方法来对付对象。如果使用

Object.entries（schedule）.length！=0