最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
vuex学习之Actions的用法详解
时间:2017-08-30 编辑:猪哥 来源:一聚教程网
Action 类似于 mutation,不同在于:
Action 提交的是 mutation,而不是直接变更状态. Action 是异步的,mutation是同步的。
沿用vuex学习---简介的案例:这里是加10 减1
1.在store.js 中 代码为:
import Vue from'vue' import Vuex from'vuex' //使用vuex模块 Vue.use(Vuex); //声明静态常量为4 const state = { count : 4 }; const mutations = { add(state,n){ state.count +=n.a; }, sub(state){ state.count--; } }; const actions = { //2种书写方式 addplus(context){//可以理解为代表了整个的context context.commit('add',{a:10}) }, subplus({commit}){ commit('sub'); } }; //导出一个模块 exportdefaultnewVuex.Store({ state, mutations, actions })
2.在App.vue中 代码如下:
这是vuex的示例
组件内部count{{count}}
相关文章
- Vue设置全局的cookie对象教程 10-26
- vue中将el-switch值true、false改为number类型的1和0解析 10-24
- Vue中的路由配置项meta使用解读 10-24
- Vue动态组件表格的实现解析 10-18
- vue parseHTML函数解析器遇到结束标签代码展示 10-12
- vue实现列表无缝循环滚动 10-12