Method vs Computed in Vue

Method vs Computed in Vue

methods: { 🔵 Runs whenever an update occurs 🔵 Not cached 🔵 Typically invoked from v-on/@ }

computed: { 🟡 Runs only when a dependency has changed 🟡 Cached 🟡 Should be used as a property, in place of data }

{{ a }} <button @click="plus">+</button> // Method

{{ aDouble }}                            // Computed
...

data: { a: 1 },
methods: {
  plus: function () {
    this.a++
  }
}
 computed: {
    aDouble: function () {
      return this.a * 2
    },
 }