vuex是官方提供的管理全局变量的工具,主要是为了组件之间的交流,同时把组件的耦合性降到最低,只要根据官方的格式来写就可以了
1、安装
npm install vuex -S
2、配置
然后在 main.js 中引入
import store from './vuex/store'
3,核心仓库 store.js
import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) // 这里定义初始值 let state = { name:"", }; const mutations = { setName(context,msg){ context.custid = msg; }, }; // 事件触发后的逻辑操作 // 参数为事件函数 const actions = { }; // 返回改变后的数值 const getters = { }; export default new Vuex.Store({ state, mutations, actions, getters })
4、读取store中的值
computed: { author () { return this.$store.state.name } }
5、改变值,官方推荐方法
this.$store.commit('setName',"Jack"); //setName要和store中mutations 里面的方法名对应
以上就是基本 简单的用法:
复杂的用法 参考 官网的 购物车案例。对于大项目~~有 区分模块的概念 等 后续补充!!
3333