CODEWITHSUNDEEP
vue.jsvuejs2
panthro
panthro

Reputation: 24099

Computed value runs every time value is updated

I have a loop that outputs checkboxes:

<div v-for="(value, key) in optionsObject" :key="key">

In computed I check whether the prop options is an object or an array (if array I make they key from the array values)...

computed: {
        optionsObject() {
            return _.isPlainObject(this.options) ? this.options : _.zipObject(this.options, this.options);
        }
    }

But everytime the checkbox is changed, it runs the computed optionsObject again. Is there anyway to prevent this?

Upvotes: 2

Views: 1079

Answers (1)

Raffobaffo
Raffobaffo

Reputation: 2856

That is how a computed property in Vue works. It refresh when a property that it depends on changes. For performances this is a huge advantage compared to a method(), as noted in the docs:

Instead of a computed property, we can define the same function as a method. For the end result, the two approaches are indeed exactly the same. However, the difference is that computed properties are cached based on their reactive dependencies. A computed property will only re-evaluate when some of its reactive dependencies have changed.

Upvotes: 2

Related Questions