“超级表达式必须为null或函数”，使用Vue 3 vue-Property-装饰器

Question

我正在尝试使用Vue 3和TypeScript创建一个新项目。为此，我想使用vue-Property-装饰器，因为我喜欢装饰器的类语法。

我使用Vue CLI创建了一个新的Vue 3 TypeScript项目。

现在，如果我尝试向Vue组件添加vue-Property-装饰器导入，我会在浏览器控制台中收到错误“Super表达式必须为空或为函数”。我的组件如下所示：

<template>
   <div>Hi</div>
</template>

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

export default class App extends Vue {
   @Prop(Number) readonly propA: number | undefined;
   @Prop({ default: "default value" }) readonly propB!: string;
   @Prop([String, Boolean]) readonly propC: string | boolean | undefined;
}
</script>

该脚本只是粘贴到我的应用程序中的模块文档副本的第一个示例。vue。然后是我的主菜。ts看起来像这样：

import { createApp } from "vue";
import App from "./App.vue";

createApp(App).mount("#app");

我看不出我的bug是从这段代码中的什么地方来的。没有其他组件、路由器或类似产品进口到任何地方。

Answer 1

在“导出默认类”部分上方添加@Component是否解决了您的问题？

import { Vue, Prop, Component } from "vue-property-decorator";
@Component
export default class App extends Vue {

编辑：啊，据我所知，vue-Property-装饰器还不正式支持Vue3。不过有一个发布版本（版本10）支持它。

https://github.com/kaorun343/vue-property-decorator/blob/next/CHANGELOG.md