属性组合 Vue 实例上不存在

Question

我有一个我无法理解的奇怪问题。每当我将计算的属性添加到我的组件时，其他方法都会显示为错误消息“属性 xy 在组合的 vue 实例上不存在”。每当我再次删除计算的属性时，错误就消失了。我在这里做错了什么？

我正在添加/删除的计算属性是“isActive”

export default Vue.extend({
  name: "Collection",
  props: { collection: { type: Object as () => Collection } },
  data: () => ({
    loading: false
  }),
  components: { CollectionStatsList },
  computed: {
    ...mapState(["account"]),
    isActive() {
      return this.account.active_collections.find(
        (c: any) => c === this.collection.id
      );
    }
  },
  methods: {
    ...mapActions(["placeBids", "deleteCollection"]),
    handleViewAssets() {
      this.$router.push(`assets/${this.collection.slug}`);
    },
    async handlePlaceBids() {
      this.loading = true;
      await this.placeBids({ collection_slug: this.collection.slug });
      this.loading = false;
    },
    async handleDelete() {
      this.loading = true;
      await this.deleteCollection(this.collection.slug);
      this.loading = false;
    },

    async handleToggleState() {
      this.loading = true;
      await accountApi.activateCollection(
        this.account.id,
        this.collection.id,
        true
      );
      await this.$store.dispatch("getCollections");
      this.loading = false;
    },

    checkboxClass() {
      if (
        !this.account.active_collections.find(
          (c: any) => c == this.collection.id
        )
      )
        return "error";

      return "success";
    }
  }
});

Answer 1

这可能是由 known limitation 引起的，其中 methods 和 computed 中的 return 类型需要注释才能使类型推断正常工作：

export default Vue.extend({
  ⋮
  computed: {
    ...mapState(["account"]),
                 
    isActive(): boolean {
      return this.account.active_collections.find(
        (c: any) => c === this.collection.id
      ) !== undefined;
    }
  },
  methods: {             
    handleViewAssets(): void {⋯},
                              
    async handlePlaceBids(): Promise<void> {⋯},
                           
    async handleDelete(): Promise<void> {⋯},
                                 
    async handleToggleState(): Promise<void> {⋯},
                        
    checkboxClass(): string {⋯},
  }
})

属性组合 Vue 实例上不存在

Property does not exist on combined Vue instance

typescript

vue.js

vuejs2

属性 组合 Vue 实例上不存在

Property does not exist on combined Vue instance

typescript

vue.js

vuejs2

属性组合 Vue 实例上不存在