vuex中,有默认的五种基本的对象:

  • state:存储状态(变量)
  • getters:对数据获取之前的再次编译,可以理解为state的计算属性。我们在组件中使用 $sotre.getters.fun()
  • mutations:修改状态,并且是同步的。在组件中使用$store.commit('',params)。这个和我们组件中的自定义事件类似。
  • actions:异步操作。在组件中使用是$store.dispath('')
  • modules:store的子模块,为了开发大型项目,方便状态管理而使用的。这里我们就不解释了,用起来和上面的一样。

在项目中创建store.js     引入vuex并export出。

 1 import Vue from 'vue'
 2 import Vuex from 'vuex'
 3 
 4 Vue.use(Vuex)
 5 
 6 const state = {
 7     count: 0
 8 }
 9 
10 export default new Vuex.Store({
11     state
12 })

mian.js中引入store

 1 import Vue from 'vue'
 2 import App from './App'
 3 import router from './router'
 4 import store from './vuex/store' // 引入store
 5 Vue.config.productionTip = false
 6 
 7 /* eslint-disable no-new */
 8 new Vue({
 9     el: '#app',
10     router,
11     store,
12     components: { App },
13     template: '<App/>'
14 })

可以创建vue实例并使用vue了

 

posted on 2021-07-08 14:23  彪悍的安迪  阅读(40)  评论(0编辑  收藏  举报