Store

Back To Home

• Store Map

merging stores

Since phila-vue-mapping is not a vue instance itself, it never runs the code to create a Vuex store itself:

Vue.use(Vuex);
new Vuex.Store({
  state: store.state,
  getters: store.getters,
  mutations: store.mutations
});

Some components in the project, however, do rely on things being kept in a Vuex store. What it needs is written out in a store that can be used, but you might want to have things in the store other than what is there.

What you can do is in your own Vue project, create your own store.js with the following imports:

import Vue from 'vue';
import Vuex from 'vuex';
import mergeDeep from './util/merge-deep';
import philaVueDatafetch from '@cityofphiladelphia/phila-vue-mapping'
const pvmStore = philaVueMapping.pvmStore

Write a store object with a state, and/or getters, and/or mutations, for example:

const mb = {
  state: initialState,
  mutations: {
    setCandidates(state, payload) {
      state.candidates = payload;
    },
    setAddressEntered(state, payload) {
      state.addressEntered = payload;
    },
  }
}

Then use the function mergeDeep to merge your store into the one

let mergeStore = mergeDeep(pvmStore.store, mb);
return new Vuex.Store({
  state: mergeStore.state,
  getters: mergeStore.getters,
  mutations: mergeStore.mutations
});