如何修复错误：属性'X'在类型 '{ object }' 上不存在

Question

我是新的vue，我有这个错误在我的vue文件

属性'ClientsSrv'不存在类型'{name: string;道具:{};data(): {ClientsSrv: ClientsService | null;ClientsList: ClientsModel[] | null;IsReady:布尔;};安装():承诺;}"。

<script lang="ts">
import ClientsService from "@/Services/Clients/ClientsService"; 
import IClientsModel from  "@/Models/ClientsModel"; 
export default {
name: "Clients",
props: {

},
data() : {ClientsSrv:ClientsService|null;ClientsList:IClientsModel[]|null; IsReady:boolean}  {

return {
ClientsSrv: null,
ClientsList: null,
IsReady: false,
}; 
},

async mounted() : Promise<void> {

this.ClientsSrv = new ClientsService();
this.ClientsList = await this.ClientsSrv.GetClients();

if(this.ClientsList!=null) 
{
this.IsReady = true;
}
},
};
</script>

有人能帮我一下吗?

Answer 1

为了让TypeScript正确地推断Vue组件选项中的类型，你需要用defineComponent全局方法来定义组件。源

<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
// type inference enabled
})
</script>

---

我还建议像这样推断响应数据的类型:

data() {
return {
ClientsSrv: null as ClientsService | null,
ClientsList: null as IClientsModel[] | null,
IsReady: false as boolean,
};
}

Answer 2

要获得类型推断，您应该使用defineComponent定义您的组件，如:

<script lang="ts">
import ClientsService from "@/Services/Clients/ClientsService"; 
import IClientsModel from  "@/Models/ClientsModel"; 
import {defineComponent} from 'vue'
export default defineComponent({
....
});
</script>