Vuex - How to persist store updates across different tabs?

Question

I have a Vue app using Vuex. If I have two tabs open, changes to the store in one tab do not show in the other.

How can I make sure store/data across all tabs is synced instantly?

const store = new Vuex.Store({
  state: {
    tasks: []
  },
  getters: {
    tasks: state => state.tasks
  }
}

In the template:

computed: {
  tasks: function () {
    return this.$store.getters.tasks
  }
}

Answer 1

This doesn't work by default. You can use vuex-shared-mutations. See here: https://github.com/xanf/vuex-shared-mutations