Vue && Vuex

by mckabue

HTML

<script src="https://unpkg.com/[email protected]/bin/r.js"></script>
<div id="app">
  <followers></followers>
</div>

JavaScript

requirejs.config({
    urlArgs: urlArgs,
    baseUrl: "/dest",
    paths: {
        'vuejs':  '//unpkg.com/[email protected]/dist/vue',
        'vuex': '//unpkg.com/[email protected]/dist/vuex',
    },
    waitSeconds: 0,
    shim: {

    },
    callback: function () {

    }
});

define('vue', ['vuejs'], function (vue) {
    return vue;
});

require(['vue', 'vuex', 'utils', 'blade-component-loader', 'text!components/index/index.html', 'router', 'ajax', 'text!/api/routes/client'], function (Vue, Vuex, utils, bladeComponentLoader, indexTemplate, router, ajax, paths) {
    Vue.use(Vuex);
    Vue.use(bladeComponentLoader);

Vue.component('followers', {
  template: '<div>{{$store.state.arr}}</div>',
  computed: {
  	newItem: function () {
    	return '123'
    }
  },
  created () {
    this.$store.commit('addArr', this.newItem);
  }
});

const store = new Vuex.Store({
state: Object.assign({
	arr: []
}, {}),
  mutations: {
    addArr(state, newItem) {
      state.arr.push(newItem);
    }
  }
})

const app = new Vue({
	store,
  el: '#app'
})