javascript - 请问下面代码中的...是扩展运算符还是操作运算符?这样写是什么意思?
问题描述
vuex中的代码
computed:{ ...mapState(['count']), count(){return this.$store.getters.count; }},
请问mapState前面的...是什么意思?加这个和不加这个有什么区别?已经看过扩展运算符和操作运算符的相关文档,不过还是不太明白,求详细点的解释。。
问题解答
回答1:自己写几个例子不就知道了…………比如:
const state = { a: 1, b: 2, c: 3};const now = { ...state, d: 4, e: 5};console.log(now);
这个语法大部分浏览器还不支持,所以你可以先去babel转一下,把转码后的代码直接放到控制台运行,看看出来的是啥。这个运算符其实挺简单的……
回答2:... 把对象在此地展开为键值对。如果直接写,有语法错误或者逻辑错误。
借用 @xiaoboost 的例子:
有 ... 运算符,点击查看
const state = { a: 1, b: 2, c: 3};const now = { ...state, d: 4, e: 5};console.log(now);
结果是
Object { 'a': 1, 'b': 2, 'c': 3, 'd': 4, 'e': 5}
没有 ... 运算符,点击查看
结果是:
Object { 'd': 4, 'e': 5, 'state': Object { 'a': 1, 'b': 2, 'c': 3 }}回答3:
...mapState(['count'])加...是为了将mapState对象分割,返回分离的各项,就可与局部计算属性(computed)混合使用了不加... mapState可是一个对象 computed也是一个对象 那就得一个一个的属性赋值吧或者你computed对象里不打算有其他属性,你直接computed:mapState(['count'])应该也可以
相关文章:
1. angular.js - Angular路由和express路由的组合使用问题2. html5 - 最近在自学react 求一个react表单提交的例子3. android - 继承一个BaseAdapter类后重写了一些方法,但是这些方法在父类中找不到,这是为什么?4. node.js - webpack-dev-server正常运行,webpack打包却出错,怎么办?5. javascript - 为什么很多网站不断请求一个空的gif?是为了获取数据同时避免跨域吗?6. 图片链接的地址怎么获得的7. 老师 我是一个没有学过php语言的准毕业生 我希望您能帮我一下8. html - jQuery 移动端横向滚动会带动网页上下滑动怎么办?9. 这段代码既不提示错误也看不到结果,请老师明示错在哪里,谢谢!10. Java IO流-InputStream是抽象类,也能调方法?(如图)
