vue-类组件& Mixins

Question

我在Vue项目中使用了带TypeScript的Vue类组件。我有组件和Mixin：

// MyComp.vue
import Component, { mixins } from 'vue-class-component'
import MyMixin from './mixin.ts'

@Component
export class MyComp extends mixins(MyMixin) {
  compValue: string = 'Hello';
}


// mixin.ts
import Vue from 'vue'
import Component from 'vue-class-component'

@Component
export default class MyMixin extends Vue {
  created() {
    console.log(this.compValue); // TS2339: Property 'compValue' does not exist on type 'MyMixin'.
  }
}

它可以工作，但是TypeScript抱怨丢失了属性'compValue‘。如何解决这个问题？

Answer 1

发生此错误是因为compValue不存在于MyMixin中。如果这是一个抽象类，从来没有单独实例化过，并且保证了属性的存在，那么可以声明它：

export default class MyMixin extends Vue {
  compValue: string;
  created() {
    console.log(this.compValue);
  }
}