vuex

2018-05-14  本文已影响0人  jh2k15
//store/index
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default () => {
  return new Vuex.Store({
    state: {
      count: 0
    },
    mutations: {
      increment (state) {
        state.count++
      }
    }
  })
}

//main
import Vue from 'vue'
import App from './App'
import router from './router'
import createStore from './store'

const store = createStore()

Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  store,
  components: { App },
  template: '<App/>'
})

//app.vue
<template>
  <div>
    {{count}}
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  },
  mounted () {
    console.log(this.$store)
    setInterval(() => {
      this.$store.commit('increment')
    }, 1000)
  },
  computed: {
    count () {
      return this.$store.state.count
    }
  }
}
</script>

上一篇 下一篇

猜你喜欢

热点阅读