0

在第一个组件中，我使用路由器
Component_1.vue 打开新页面：

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

路由器.ts：

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,
    },
  ]
});

调度页面.vue

schedule该组件在从异步函数获取之前渲染。如何解决这个问题呢？是的，我读过这个问题，但我不明白如何存储和返回created()承诺getSchedule()

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

<script lang="ts">
import store from "@/store"

import Vue from 'vue';
import ScheduleTable from '../components/ScheduleTable.vue';
import Component from 'vue-class-component';
import { ISchedule }  from "@/interfaces";
import * as api from '@/api';


export default Vue.extend({
  components: {
    ScheduleTable,
  },

  data(){
    return {
      schedule : {}
    }
  },
  methods: {
    getSchedule : async function () {
      this.schedule = await api.getScheduleById( this.$route.params.id );
    }
  },
  async created(){
    await this.getSchedule();
  }

});
</script>
4

1 回答 1

0

感谢菲尔的帮助。我错了 

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

schedule不是数组，是对象。最好使用这样的东西

object.entries(schedule).length != 0

有关在此处测试对象是否为空的更多信息

于 2019-10-14T17:20:59.230 回答