Vue Prop 未定义，and/or 不能在 v-for 上使用。使用打字稿和装饰器

Question

好吧，我正在将 Vue 与 typescript 一起使用，并尝试将 props 与 v-for 一起使用，但它没有呈现任何内容。 代码如下

我已经尝试过计算道具，还为列表提供了默认值并创建了一个在构造函数上实例化的新变量，即使是在挂载上，但它仅在我实例化列表时有效，例如：@Prop() list!: string[] = ['foo', 'bar']

我的代码给出了以下错误："Property or method 'list' is not defined on the instance but referenced during render."（它呈现菜单样式而不是列表样式）：

<template>
  <div class="home">
    <window-menu :list="['foo', 'bar']" />
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import WindowMenu from "@/components/WindowMenu.vue";

@Component({
  components: {
    WindowMenu
  }
})
export default class Home extends Vue {}
</script>

<template>
  <div class="window-menu">
    <ul class="window-list">
      <li v-for="(item, index) in list" v-bind:key="index">{{item}}</li>
    </ul>
  </div>
</template>

<script lang="ts">
import { Prop, Vue, Watch } from "vue-property-decorator";

export default class Menu extends Vue {
  @Prop() private list!: string[];
}
</script>

Answer 1

我修好了。嗯，错误是我没有使用 @Component 装饰器，然后 Vue 无法编译道具。 下面固定的代码。

<script lang="ts">
import { Prop, Vue, Component} from "vue-property-decorator";

@Component
export default class Menu extends Vue {
  @Prop() private list!: string[];
}
</script>

Vue Prop 未定义，and/or 不能在 v-for 上使用。使用打字稿和装饰器

Vue Prop not defined, and/or cannot be used on v-for. Using typescript and decorators

typescript

vue.js

vue-component

typescript-decorator