JSFiddle - React, Tailwind, and code Playground

by Craig Humphreys

HTML

<script src="https://unpkg.com/vue@2.5.3/dist/vue.js"></script>
<script src="https://unpkg.com/vuex@3.0.1/dist/vuex.js"></script>
<div id="app">
  {{cart}}
</div>

JavaScript

const store = new Vuex.Store({
  state: {
    cart: {
      item: 'foo'
    }
  },
  mutations: {
    setCart(state, value) {
      state.cart = value
      console.log('cart changed');
    }
  }
})

new Vue({
  el: '#app',
  created() {
    setTimeout(() => {
      store.commit('setCart', {
        item: 'bar'
      })
    }, 1000)
  },
  computed:{
    cart(){
      return store.state.cart
    }
  }
});