vuex

一.什么是vuex

Vuex是一个专为Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex也集成到Vue的官方调试工具devtools扩展,提供了诸如零配置的time-travel调试,状态快照,导入等高级调试功能。

vuex_第1张图片

 二.做了一个官方点击加次数的经典案例 

vuex_第2张图片

 

index.js和count.vue代码如下

index.js

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
  // 数据都放在state里面
  state: {
       count:0 //初始化数据
  },
  // 同步的一些操作在这里面
  mutations: {
      ADD(state){
          state.count++
      },
      JIAN(state){
          state.count--
      }
  },
  actions: {
      actionAdd({commit}){
          commit('ADD')
      },
      act({commit}){
          commit('JIAN')
      }
  },
  getters:{
      isodd(state){
          return state.count % 2===0?'偶数':'奇数'
      }
  }
})

 

 count.vue

注释的代码是另外两种方法获取mutations里面方法的方法





你可能感兴趣的:(vuex)