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了