title: Vuex state doesn't updated between Vue instances
body: <p>I have 3 different Vue instances that are using the same store but when I change the value of 'language' from the one instance, the others doesn't be updated</p>
  <pre class="lang-js prettyprint-override"><code>&lt;script&gt;
    import { mapState } from 'vuex';
    import store from '@common/store/'
  
    export default {
      methods: {
        setLocale(lang) {
          store.dispatch('setLanguage', lang)
        },
      },
      computed: {
        ...mapState({
          language: state =&gt; state.language.language,
        }),
      },
    }
  &lt;/script&gt;
  </code></pre>
  
  language/index.js
  <pre><code>export default {
  
      state: {
          language: __language,
      },
      getters: {
  
          getLanguage: state =&gt; () =&gt; {
              return state.language
          },
      },
      actions: {
          setLanguage({ commit }, lang) {
              commit('setLanguage', lang);
          },
      },
      mutations: {
          setLanguage(state, lang) {
              state.language = lang;
          },
      },
  };
  </code></pre>
  
  <pre class="lang-js prettyprint-override"><code>import Vue from 'vue';
  import App from './App';
  import i18n from &quot;@common/i18n&quot;;
  import store from '@common/store/'
  import { mapState } from &quot;vuex&quot;;
  
  new Vue({
      store,
      i18n,
      render: h =&gt; h(App),
      computed: {
          ...mapState({
              language: state =&gt; {
                  i18n.locale = state.language.language
                  return state.language.language
              },
          }),
      }
  }).$mount('#menu');
  </code></pre>
  <p><a href="https://i.stack.imgur.com/7c8iM.png" rel="nofollow noreferrer">first instance which I made the state change</a></p>
  <p><a href="https://i.stack.imgur.com/iQkn5.png" rel="nofollow noreferrer">second instache which is not updated</a></p>