vue-property-decorator
vue-property-decorator copied to clipboard
@Ref seems to not add needed getters to 'this' context
We are seeing a major difference between
@Ref()
private input?: HTMLInputElement;
private foo = {
someFunction: () => this.input // this#1
};
// Here this#1 has access to foo as a getter, but not input.
So when foo.someFunction() is called, it returns undefined; Not desireable
@Ref()
private input?: HTMLInputElement;
private foo = {
someFunction: () => this.getInput(); // this#1
}
private getInput() {
return this.input; // this#2
}
// Here this#1 has access to foo as a getter, getInput as a getter, but not input.
// Here this#2 has access to foo as a getter, getInput as a getter, AND input as a getter.
So when foo.someFunction() is called, it returns the input element as desired.
I know it's late, but for future visitors:
This is the scoping caveat noted here in the docs for vue-class-component library that this repo depends on.
Basically, declare direct methods to allow for magic-binding of this within the method block to the component class's Vue instance.