//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>
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。