I want to use a function as a data property. This seems to work fine as in the case of the 'works' data property. However I need the this context in the function so that I can calculate values stored in the this.shoppingCart (another property).

Is this possible? If so what am I doing wrong?

 new Vue({
    el: '#vueApp',

    data: {

        shoppingCart: [],      

        works : function () {
            return "testfunc";
        },
        totalPriceCalcProperty : function () {

             this.totalPrice = this.shoppingCart.reduce(function(total, cartItem){

                console.log(total, cartItem);
                return total + parseFloat(cartItem.price);

            }, 0);
        }
    },

    methods: {

       totalPriceCalc: function () {

            this.totalPrice = this.shoppingCart.reduce(function(total, cartItem){

                console.log(total, cartItem);
                return total + parseFloat(cartItem.price);

            }, 0);
        },
    }
share|improve this question

You should implement this by using methods, not data.
data is helping you to store something rather than handle some actions.

In methods, you can call this.xxx to get the properties from data or property

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.