Search code examples
vue.jsmethodscomputed-properties

How to acces a computed property from a method in Vue.js


I'm trying to acces to the "generatedOrder" object from a method called "onSubmit()". This object was previously commited to the store from another component and it is fetched with a computed property from a getter to the component where I need to use it. When I print {{generatedOrder.paymentRequest.code}} at template I get the code, but when I try to use it at the onSubmit method I get the following error at console TypeError: Cannot read properties of undefined (reading 'code')

Here is some of my components code:

...
<button @click="onSubmit" class="w-button super-button mt-3">
                                <h6>COBRAR ORDEN DE COMPRA</h6>
                                <p>Caso usuario empresa cobra desde su dispositivo</p>
                        </button>
...

<script>
    module.exports = {
    data() {
        return {
        };
},
    computed: { 
        generatedOrder(){
            return this.$store.getters.generatedOrder
        },
    },
    methods: {
        onSubmit(generatedOrder){
            //ARREGLAR
            window.location.href = drupalSettings.path.baseUrl + 'pagar/' + generatedOrder.paymentRequest.code
        }
    },
}
</script>

Solution

  • It should be this.generatedOrder.paymentRequest.code

    You ave to use this for every property in data and computed