Question

bar是一个简单的类装饰器，它将属性添加到类Foo中。

function bar(target) {
    target.inDecorator = 'in decorator';
}

@bar
class Foo {
    inClass:string;
    inDecorator:string;
    constructor() {
        this.inClass = 'a string';
    }

    getInClass() {
        return this.inClass;
    }
}

console.log(Foo.inDecorator);
console.log(Foo.prototype.inDecorator);
const foo = new Foo();
console.log(foo.getInClass());
console.log(foo.inDecorator);

导致错误的唯一控制台日志是第一个，Foo.inDecorator，包含在ts 1.5.3中的

Property 'inDecorator' does not exist on type 'typeof Foo'.

据我所知，inDerator应该在Class Foo的原型上定义，并且应该在Foo上可用，就像它是静态道具一样。运行生成的js文件显示原型访问以及新foo对象的未定义，但是Foo.inDecorator即使它是错误的来源也能正确打印。为了更清楚，我们得到了

in decorator
undefined
a string
undefined

关于如何正确输入/添加静态道具或方法的任何想法？

谢谢！

编辑这个，因为我最初忽略了原型访问，Foo.prototype.inDecorator无法正常工作的事实。

Answer 1

在装饰器中target引用函数 - Foo - 而不是原型 - Foo.prototype。

所以在装扮者中target.inDecorator = ...与Foo.inDecorator = ...相同而不是Foo.prototype.inDecorator = ...。

这是实现目标的一种方式：

interface BarStatic {
    new(): BarInstance;
    inDecorator: string;
}

interface BarInstance {
    inDecorator: string;
}

function bar(target: BarStatic) {
    target.inDecorator = 'static';
    // note that prototype will be `any` here though
    target.prototype.inDecorator = 'instance';
}

@bar
class Foo {
    static inDecorator: string; // required
    inDecorator: string;        // required
    inClass: string;

    constructor() {
        this.inClass = 'a string';
    }

    getInClass() {
        return this.inClass;
    }
}

console.log(Foo.inDecorator);           // static
console.log(Foo.prototype.inDecorator); // instance
const foo = new Foo();
console.log(foo.getInClass());          // a string
console.log(foo.inDecorator);           // instance

typescript类装饰器：在装饰器函数中定义的类型属性

1 个答案: