介绍:
vuex是一个状态管理器,也可以作为一个数据仓库使用。vuex可以将全局的数据做一个数据共享,例如,以前我们都是用session保存用户的登录状态或者用户信息,现在则直接可以使用vuex存储全局使用的数据。
安装:
npm install vuex --save
你可以在src文件夹下新建一个vuex的文件夹,在文件夹下新建一个store.js文件。
store.js代码:
页面引用:
mutation是作为改变vuex里面状态的值的方法使用的。例如,我们在在store.js里面写一个让count改变值的两个函数:
const mutations={
add(state){
state.count++;
},
reduce(state){
state.count--;
}
}
然后将mutations暴露出去。
export default new Vuex.Store({
state,
mutations
})
然后你就可以在你的模版中使用了:
vuex运行原理,大概如下图:
Actions 执行异步操作如调用后台api 然后dispatch actions 方法 再commit mutations 再对state 进行修改
Mutataions 执行的是同步的操作。可以直接使用改变state
state 作为状态,改变后会直接作用到View上