资讯专栏INFORMATION COLUMN

vue和vuex中的ES6 Shorthand method names

focusj / 1003人阅读

摘要:最近在用和开发。最后查到其实并不是计算属性,而是而计算属性其实是这样的仔细对比和。所以这个语法糖其实就是,省略了,省略了冒号和。虽然这个不是很甜,但好歹是个糖,糖多了自己写的别人就看不懂了。而人们往往对于不懂的东西,都会说逃

最近在用vue和vuex开发。
在.vue单文件的生命周期和vuex的actions定义中,有两段代码让人费解:
pag.vue

export default {
    //...
    created(){
        this.$store.dispatch("getUsersSize")
    }
    //...
}

action.js中

const actions = {
    getAllUsers({commit},url){
        dataapi.getData(url,(users)=>{
            commit(types.RECEIVE_USERS,{users})
        })
    }
}

抽离出来就是{created(){}}{getAllUsers({commit},url){}}
正常情况下,如果将函数赋值到对象的属性值,简称为方法,应该这样写才对:
{created:function(){}}以及{getAllUsers:function({commit},url){}}

所以我很纳闷这是什么鬼东西?

印象中ES6有个概念叫computed property,于是去查MDN。
最后查到其实并不是计算属性,而是shorthand methods names

// Shorthand method names (ES2015)
var o = {
  property([parameters]) {}
};

而计算属性其实是这样的:

// Computed property names (ES2015)
var prop = "foo";
var o = {
  [prop]: "hey",
  ["b" + "ar"]: "there"
};

仔细对比{created(){}}{created:function(){}}
所以这个ES6 Shorthand method names语法糖其实就是,省略了":function",省略了冒号和"function"。
虽然这个sugar不是很甜,但好歹是个糖,糖多了自己写的bug别人就看不懂了。
而人们往往对于不懂的东西,都会说:666
(逃

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89371.html

相关文章

  • vuex的使用

    摘要:使用状态对象的访问我把理解成构造器中的里面存放一些数据,例如用户姓名性别身份证号等等。 vuex是配合vue一块儿使用的一个状态管理工具。我通常使用它来保存一些全局的数据,例如用户登录信息,用户身份信息,总之一些在很多页面都会使用到的信息,都保存在vuex里面,用的时候就不需要再去请求接口了,直接去vuex里面拿就可以了。先放官网地址 安装 npm install vuex --sav...

    tunny 评论0 收藏0
  • vuex的使用

    摘要:使用状态对象的访问我把理解成构造器中的里面存放一些数据,例如用户姓名性别身份证号等等。 vuex是配合vue一块儿使用的一个状态管理工具。我通常使用它来保存一些全局的数据,例如用户登录信息,用户身份信息,总之一些在很多页面都会使用到的信息,都保存在vuex里面,用的时候就不需要再去请求接口了,直接去vuex里面拿就可以了。先放官网地址 安装 npm install vuex --sav...

    lemon 评论0 收藏0
  • Vuex源码阅读笔记

    摘要:而钻研最好的方式,就是阅读的源代码。整个的源代码,核心内容包括两部分。逃而动手脚的代码,就存在于源代码的中。整个源代码读下来一遍,虽然有些部分不太理解,但是对和一些代码的使用的理解又加深了一步。 笔记中的Vue与Vuex版本为1.0.21和0.6.2,需要阅读者有使用Vue,Vuex,ES6的经验。 起因 俗话说得好,没有无缘无故的爱,也没有无缘无故的恨,更不会无缘无故的去阅读别人的源...

    hosition 评论0 收藏0
  • Vuex 入门到进阶

    先说一下Vuex到底是什么? Vuex 是一个专门为 vue.js 应用程序开发的状态管理模式 这个状态我们可以理解为在 data 中的属性,需要共享给其他组件使用的部分 也就是说,我们需要共享的数据,可以使用 vuex 进行统一集中式的管理 喜欢看代码学习的的可直接下载下方 Demo https://gitee.com/jiangliyue/... Vuex中的五种基本对象 state...

    mylxsw 评论0 收藏0
  • [新手坑] 03.Vue-CLI用ES6编码仍需要手动安装一些Babel插件

    摘要:用编码仍需要手动安装一些插件这五一几天没什么事情想着再深入研究下然后又找了些教程结合官方文档研究却遇到了一个坑爹的问题在安装完成后如果需要用到一些语法编写代码有时候报错的话可能是缺少编译插件比如我在看文档和部分教程的时候有类似这样的代码 Vue-CLI用ES6编码仍需要手动安装一些Babel插件 这五一几天, 没什么事情, 想着再深入研究下Vuex, 然后又找了些教程, 结合官方文档研...

    lwx12525 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<