Vue && Vuex

by Max Sinev

HTML

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vuex"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<div id="app">
  <div v-for="(v, k) in $store.getters.testKeys">{{ v }} - {{ $store.state.test[v] }}</div>
  --------------------------------
  <div v-for="(v, k) in $store.getters.testKeys2">{{ v }}</div>
  <button @click="update" >UPDATE</button>
</div>

JavaScript

const store = new Vuex.Store({
  state: {
  	test: {
    	
    }
  },
  getters: {
  	testKeys: (state) => Object.keys(state.test),
    testKeys2: (state, getters) => getters.testKeys.map((tk) => tk + "-2")
  },
  mutations: {
  	updateTest(state, prop) {
    	a = () => {};
      a.toString = () => 'Hello!'
    	Vue.set(state.test, prop, a)
    }
  }
})

const app = new Vue({
	store,
  el: '#app',
  date() {
  	return {
    	
		}
  },
  methods: {
  	update() {
    	this.$store.commit("updateTest", Math.random().toString(16).substring(2))
    }
	}
})