vueX的属性和实现非父子组件的传值

vuex的属性

• state：管理项目中的数据，所有共享的数据都要统一放在state中进行存储

  const store = new Vuex.store({
  	state： {
  		count: 0;
  	}
  })
  

  访问state中数据的方式：
  1、 this.$store.state.count
  2、首先从vuex中导入mapState函数，通过mapState函数将当前组件所需的全局数据映射到computed计算属性

  import {mapState} from 'vuex';
  computed: {
  	...mapState({'count'})
  }
  

• getters：读取state中的数据，getter有点类似vue.js的计算属性。
• mutation：更改store中state状态，每个mutation都有一个字符串类型的事件类型和一个回调函数，我们需要改变state的值就要在回调函数中改变。我们要执行这个回调函数，那么我们需要执行一个相应的调用方法：store.commit
• action：提交mutation，在action中可以执行store.commit，而且action中可以有任何的异步操作。在页面中如果我们要用这个action，则需要执行store.dispatch
• module：将store分割成模块，每个模块中拥有自己的state、mutation、action和getter。
  

非父子组件传值

1、新建index.js

2、a.vue组件中

3、b.vue

实现效果：
打开页面会在显示a，b组件中获取到的state中的公共数据，当在b.vue组件的input输入框中输入内容时，会同时改变两个组件的显示，相当于在b.vue组件中改变信息，a.vue组件中会接收到信息，并发生改变。