首先我们要先知道三个点是什么意思…；简单点理解可以讲三个点看成就是省略号，省略号表示有些东西被隐藏了，用省略号就是表示这个对象是可以展开的，所以三个点ES6中也定义为扩展运算符或者展开运算符，好理解吧，那么想下面这部分代码又是什么意思呢？
index.vue文件:
import { mapState, mapMutations, mapActions, mapGetters } from 'vuex'
export default{
methods: {
//1
...mapMutations({
add: "add", //相当于在当前页面执行this.add()方法，就等于执行了this.$store.commit("add")
}),
//2
...mapMutations({
plus: "add",//跟上面1一样当前页面执行this.plus()方法，就等于执行了this.$store.commit("add")；plus相当于别名
}),
//3
...mapMutations([
'add' //跟1等同，另一种写法而已 ，这一整个方法展开就等于add(){this.$store.commit("add")},这样不就是methods里定义方法的形式吗？
]),
//4
...mapMutations('filter', [
'setValue' //意思是获取filter模块中mutation对象里的setValue方法，在这里展开，实际上就是setValue(){.........}；至于setValue里面是什么代码，就看filter模块的mutation对象的这个方法定义了什么
])
},
computed:{
//5
...mapState({
value: state => state.filter.value //等于value(){return this.$store.state.filter.value}//filter模块中state对象中的value值
})
//6
...mapState('filter', {
value: state => state.value//跟5是一样的意思：获取filter模块中的state里的value值，filter模块是存在整个mapState对象里的
})
}
}
上面的…意思就是展开跟在后面的函数/方法/对象的内容，后面是一个整体，所谓展开简单来说就是去掉外面的中括号/大括号，举例：
//1、数组
let arr=[1,2,3,4,5]
//如果要赋值给新数组
let newArr = ...arr;//错误写法，因为...arr展开后是字符串：1,2,3,4,5
let newArr = [...arr];//正确写法 [1,2,3,4,5]
//JSON对象
let jsonObj = {a:function(){},b:()=>{}};
//展开
...jsonObj
//等于
a:function(){
},
a:()=>{
}
//然后你就发现...mapMutations为什么会这么写，这种写法不就是将里面的元素一个个排列出来吗，放在methods里面正是符合写法规则的
//这两个的写法是不是可以简化成：
a(){
},
b(){
}
//所以就跟mutation对象里的写法一样了，看下面的filter.js代码
//慢慢对照多几遍就能理解了
为了更深入的了解nuxtjs项目中vuex是如何跟.vue文件联系起来用的，基于上面的写法，我们看看filter.js这个模块的代码:
const state = ({
value: 'Hello World',
num:1,
list:[1,2,3]
});
const mutations = {
setValue(state, value) {
state.value = value;
},
test(state,n){
state.num = n;
},
do(state,n){
state.list.push(n);
}
};
export default {
state,
mutations
};
然后filter.js这个模块是要被引入到nuxtjs项目中的store文件夹下的index.js中进行统一引用的，index.js文件如下：
import Vue from 'vue';
import Vuex from 'vuex';
import filter from './filter';
Vue.use(Vuex);
const store = () => new Vuex.Store({
state: {
},
mutations: {
},
modules: {
filter
}
});
export default store
index.js文件是将store对象暴露给所有.vue文件全局使用的，调用方法为this.$store或者直接store都可以调用，而filter则是分模块，需要在index.js中引入，如果还有其他模块也是一样的引入与使用方法； 理解了这个结构，我们就知道为什么是这么用的了，
对于其他的对象比如mapActions、mapGetters，其实都是一样的用法，只不过mapActions适用于放有异步(dispatch)操作的方法，mapMutations适用于同步(commit)，这两个触发的方法分别是commit与dispatch。
vuex这个组件中的分块模式稍微复杂点，不过用于做大项目中不同组件间通信是很好的；
普通经典模式对于组件间通信不是那么多的情况下是可以用的，不过nuxtjs3中之所以要去掉普通模式， 小编认为第一个原因是将所有共享对象都在一个文件里，会导致这个文件过大，
另一个是因为很少的共享对象用普通模式还不如直接建立空vue对象，用bus来通信：this.$emit(“a”)与this.$on(“a”)更好，
所以对于中大项目来说就必须用分块模式，分开管理不同的共享属性（公共抽象），新增的模块不会影响旧模块， 也更加方便管理； 好了，今天就说这么多，看不懂的同学可以多看几遍，慢慢理解。
