vue 箭头函数与function函数的区别

1、this指向问题:

(1)funtion普通函数中this指向window;所以如果需要在function函数中使用this对象,需要事先把this对象赋值给其他变量,如:

 let self = this;
 this.getReportId().then(function(result) {
    self.id = result;
    alert(self.id);
 });

(2)箭头函数中this指向vue实例:箭头函数相当于匿名函数,并且简化了函数定义。看上去是匿名函数的一种简写,但实际上,箭头函数和匿名函数有个明显的区别:箭头函数内部的this是词法作用域,由上下文确定。此时this在箭头函数中已经按照词法作用域绑定了。很明显,使用箭头函数之后,箭头函数指向的函数内部的this已经绑定了外部的vue实例了。如:

 this.getReportId().then(result => {
        this.id = result;
        alert( this.id);
});

2、写法转换:以下两种写法效果是一样的:

formatter: function(params) {
                  return params.name + ' 已接入: ' + params.data.num[2];
              }
 formatter: params => {
            return params.name + ' 已接入: ' + params.data.num[2];
          }

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

w_t_y_y

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值