[Vuejs]-Vue computed properity not updating value

1👍

you better update your state inside vuex and bring updated value from vuex using computed value. Because, Computed is not reactive which you cannot change it easily. If you want to change it here, you should make get and set as well. Better option, make action which mutates your state, and sort it in getters.

0👍

The store state should not be modified outside of the store. Instead, you should use a Vuex mutation to update the store.

Declare the mutation that performs the update to state.categories:

// store.js
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  modules: {
    categories: {
      namespaced: true,
      ⋮
      mutations: {
        SET_ALLOWED(state, value) {
          state.categories.forEach(c => c.allowed = value)
        },
      },
    },
  },
})

In your component, call commit() to use the mutation:

// MyComponent.vue
export default {
  ⋮
  methods: {
    update() {
      this.$store.commit('categories/SET_ALLOWED', true)
    },
  },
}

demo

Leave a comment