在传统的通信方式中有这样一个问题我们实现起来很麻烦，就比如，在Vue框架中，有A和B两个组件，A中数据B需要用就可以给B绑定全局事件总线$bus.$on("xxx事件"，回调函数)，然后A组件触发$bus.$emit("xxx事件",传给数据)，就是如下图的展示:
这样B就可以得到A的数据，但是有这样一个问题，如果还有组件C，组件D，组件E……等等很多都需要这个数据该怎么办呢，难不成给每一个组件都去绑定全局事件总线吗，那样就会很麻烦，而且容易代码编写冗余，这个时候就可以利用Vuex插件来帮我们解决这个问题，先看一下下面这个图：
利用Vuex来当全局共享组件来服务各个组件都需要的数据，而且都是双方连接，可以支持读写操作。我们接下来先配置一下Vuex
第一步是先得下载Vuex，他本身是一个插件大家根据自己的vue版本安装对应的vuex
下面是vue2支持的版本：
npm i vuex@3
vue3支持的版本：
npm i vue@4
随后就是搭建Vuex环境，代码如下：在脚手架的components文件下先创建一个文件夹(名字随意即可，我用的vuex当的文件夹名字)，完成之后在你创建文件之下在创建一个js文件（名字也是随意起即可,我这里用的是vuex.js）然后就是配置vuex.js里的属性操作:
// 该文件来创建Vuex中的核心store
// 引入Vuex,我们这里是vue2,所以要引入Vuex3版本的包,vue3的话就引入Vuex4的包
import Vuex from 'vuex';
import Vue from 'vue'
Vue.use(Vuex)
//准备actions来用于组件的动作(服务)
let actions = {
plus:function(minstore,value){
minstore.commit('plus', value);
}};
//然后就是mutations 来操作数据
let mutations = {
plus(minstore,value){
minstore.n+=value;
}};
//最后是state 来存储数据
let state = {
n : 1//配置数据};
// 创建store来管理这三个对象,并暴露出去
export default new Vuex.Store({
actions:actions,
mutations:mutations,
state:state});
这里就得来说一下actions，mutations，state这些有什么作用，先看一张图：
这是vuex的运行图，
最后看一下实现效果是什么样子的：
我们的目的就是通过vuex来实现两个不同组件的按钮都可以获得对数据1的修改和获取：
