~~~
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
// 相当于data对象的状态对象
const state = {
count: 0 //指定初始化数据
}
// 包含多个更新状态的方法的对象
const mutations = {
INCREMENT (state) {
state.count ++
},
DECREMENT (state) {
state.count --
}
}
// 包含多个间接更新状态的方法的对象
const actions = {
increment ({commit}) {
commit('INCREMENT')
},
decrement ({commit}) {
commit('DECREMENT')
},
incrementIfOdd ({commit, state}) {
if(state.count%2===1){
commit('INCREMENT')
}
},
incrementAsync ({commit}) {
setTimeout(()=>{
commit('INCREMENT')
}, 1000)
}
}
// 包含多个getters计算属性的对象
const getters = {
evenOrOdd (state) {
return state.count % 2 ? '偶数' : '奇数'
}
}
export default new Vuex.Store({
state,
mutations,
actions,
getters
})
~~~
- 开发工具
- VsCode
- 常用插件
- Html5
- 标签
- video
- form
- 读取文件
- 地理位置
- canvas
- 本地存储
- localStorage
- sessionStorage
- 网络状态
- Css3
- 背景
- 边框
- 边框图片
- 文字阴影
- 渐变
- Js
- ES6
- 常量和变量
- 模板字符串
- 箭头函数
- 解构赋值
- Spread Operator
- import export
- Promise
- 打包
- webpack
- 安装
- 为什么要打包
- 核心概念
- 热更新
- 入门例子
- js打包
- css打包
- vue
- 简介
- Vue-cli
- 搭建
- 打包发布
- eslint
- Mint-ui
- Vuex
- 状态管理模式
- 使用
- main.js
- store
- component
- Mockjs
- 简介
- EasyMock