Question

我正在学习如何使用装饰器，并且遇到以下问题。这是我的代码：

function boo(): any {
    return function(target: object, propertyKey: string, descriptor: PropertyDescriptor) {
        console.log("boo");
        return descriptor;
    }
}

class A {

    @boo
    private str: string = null;

    constructor() {
    this.str = "test";
    }

}

let a: A = new A();

这就是我得到的：

TypeError: Cannot assign to read only property 'str' of object '#<A>'

如何解决？

Answer 1

使用严格的null检查，不能将null分配给MyClass。您需要输入string str的类型。

另一个问题是您需要调用string | null。 boo从技术上讲是一个装饰工厂。装饰器本身是带有签名boo的函数。

(target: object, propertyKey: string, descriptor: PropertyDescriptor) => PropertyDescriptor

如果需要将额外的参数传递给装饰器，则需要使用装饰器工厂。例如：

function boo(): any {
    return function(target: object, propertyKey: string, descriptor: PropertyDescriptor) {
        console.log("boo");
        return descriptor;
    }
}

class A {

    @boo()
    private str: string| null = null;

    constructor() {
        this.str = "test";
    }

}

let a: A = new A();

在这种情况下，您实际上不需要使用装饰器工厂，这也可以正常工作：

function boo(otherInfo: string): any {
    return function (target: object, propertyKey: string, descriptor: PropertyDescriptor) {
        console.log("boo " + otherInfo);
        return descriptor;
    }
}

class A {

    @boo("Other info")
    private str: string | null = null;

    constructor() {
        this.str = "test";
    }

}

尽管以上工作正常，但我通常仍会使用装饰器工厂，以便以后添加参数并使事情保持一致。

装饰字段在TypeScript中给出只读错误

1 个答案: