Vuex and Google Analytics

To be able to use vue-analytics from your Vuex store, just import the methods you need and fire it directly from the store

First step

Make sure to have your vue-analytics package installed before start using it in your store

  1. // main.js
  2. import Vue from 'vue'
  3. import store from './store'
  4. import App from './App'
  5. import VueAnalytics from 'vue-analytics'
  6. Vue.use(VueAnalytics, {
  7. id: 'UA-xxxx-1'
  8. })
  9. new Vue({
  10. store,
  11. render: h => h(App)
  12. }).$mount('#app')

Second step

Start using vue-analytics API in your store

  1. // store.js
  2. import Vue from 'vue'
  3. import Vuex from 'vuex'
  4. import { event } from 'vue-analytics'
  5. Vue.use(Vuex)
  6. export default new Vuex.Store({
  7. state: {
  8. counter: 0
  9. },
  10. actions: {
  11. increase ({ commit, state }) {
  12. commit('increase', state.counter + 1)
  13. }
  14. },
  15. mutations: {
  16. increase (state, payload) {
  17. state.counter = payload
  18. event('user-click', 'increase', 'counter', state.counter)
  19. }
  20. }
  21. })