动态组件在vue-cli3的typescript中使用不了

Question

vue-cli3配置使用了typescript,动态组件使用不了，在chrome中显示不出了，控制台提示错误

Vue warn: Property or method "Hello" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property.

<template>
  <div class="hello">
    <h1>{{ msg }}</h1>
      <hello></hello>
      <component :is="Hello"></component>
  </div>
</template>

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator'
import Hello from './hello.vue'

@Component({
  components: {
  Hello
  }
  })
export default class HelloWorld extends Vue {
  @Prop() private msg!: string;
}
</script>

Answer 1

because dynamic components require a variable from data, props or computed. Most likely data. So something like data() { return { component: "Hello" } }

添加下面的代码就可以了
private Hello: string = 'Hello'