typescript - Nuxt 验证——为什么不是类组件？

Question

我正在使用 Nuxt 2.8.1 和 typescript 3.4。当我创建一个组件并为该页面定义“验证”时，我无法访问该类上定义的 es6 属性：

@Component
class Foo extends Vue {
  get foo (): boolean { return true }

  validate () {
    return this.foo // returns undefined?
  }
}

[注意：验证没有传递一个 Vue 实例。至少，如果thisfor validate 实际上不是一个Foo实例，工具应该会出错。]

我应该如何访问foo？

更新好的......（感谢@Mohan的提问）这里真正的问题是（作为一个nuxt/vue新手），我在页面中定义了一个vue文件，并认为所有vue文件都是组件。但是，页面不是组件。（我猜@Page 装饰器会很好地支持基于类的页面。）但是这个故事的寓意是页面没有基于类的支持，因此不validate()使用“组件实例”调用并不奇怪”。

标签： typescriptnuxt.js

Answer 1

我不是 100% 确定这是否是您所要求的，但似乎您使用的get关键字不正确。我附上了一个小例子，说明我通常如何使用 get 和 set 关键字。我认为这个例子应该足以指导你。

class Person{
    private _name:string;
    private _occupation:string;
    constructor(name:string, occupation:string){
        this._name = name;
        this._occupation = occupation
    }
    get occupation(){
        return this._occupation;
    }
    set occupation(occup:string){
        // do some grammar and spelling checking here too???

        this._occupation = occup;
    }
}
let Obama = new Person('Obama', 'President');
console.log(Obama.occupation);
// console.log(Obama._name) error
Obama.occupation = 'Chilling';
console.log(Obama.occupation);