How to access method from a computed property in Vue?

Question

In my Vue component I have a single method and a single computed property which calls that method.

Twist is that I have a getter class which stores this getter.

Here is the getter class in a separate .js file:

export default class Getter { constructor(getter) { this.get = getter; } }

And here is how I use it in a Vue component:

<script>
    import Getter from "@/model/Getter";
    
    export default
    {
        computed: { property: new Getter(this.getProperty) },

        methods: { getProperty() { alert("getter"); } }
    }
</script>

The problem I am getting says that this (inside the Getter constructor call [line 6]) is undefined. I do not know why is that.

If line 6 is replaced with:

computed: { property: new Getter(function() { alert(this); }) },

everything works as expected and this is defined.

Of course I know that I can define getter inline, and that works, but I am just curious about why my example does not work? Why is in the first example this undefined?

Getter class is not important here; even without it, it does not work if I do this:

computed: { property: { get: this.getProperty } }

Thank you.

How to access method from a computed property in Vue?

0 Answers0