胖蔡说技术
随便扯扯

Unexpected aliasing of ‘this’ to local variable.eslint@typescript-eslint/no-this-alias)

代码仓库的提交Git上添加了代码规则校验ESlint,有关eslint的相关介绍可参考:Webpack 项目添加 eslint 实现代码检测功能。在提交代码的时候出现报错信息:

其原因是默认在eslint中存在如下配置:

// .eslintrc.cjs
module.exports = {
  "rules": {
    "@typescript-eslint/no-this-alias": "error"
  }
};

官方说明如下:

为其分配一个变量而不是正确使用箭头lambdas可能是ES6之前的实践或没有很好地管理范围的症状。

Assigning a variable to this instead of properly using arrow lambdas may be a symptom of pre-ES6 practices or not managing scope well.

解决方法

知道了问题的原因所在,就方便对于问题的解决了。我的思路是有两个解决方式,无非就是我们常说的:解决提出的问题又或者是解决提出问题的人。

1、解决问题提出者

这种就简单了,直接从源头上解决,直接在当前项目的eslint配置文件中将这个规则删除,若是继承规则,就在配置文件中覆写规则,替换错误等级,如下:

// .eslintrc.cjs
module.exports = {
  "rules": {
    "@typescript-eslint/no-this-alias": "off" // 或者改成warn
  }
};

2、解决问题本身

个人体长这种方式,这个问题本身就是为了防止出现this指向混乱引入的规则,出现这种报错也就是我们的代码本身的规范存在问题,修改函数为箭头函数,去除this的变量赋值分配,如下:

function ActivitiModdleExtension(eventBus) {
-  let that = this // older
  eventBus.on(
    'property.clone',
-    functoin(context) {
+    (context) => {
      const newElement = context.newElement
      const propDescriptor = context.propertyDescriptor
-      that.canCloneProperty(newElement, propDescriptor)
+      this.canCloneProperty(newElement, propDescriptor)
    },
  )
}

赞(0) 打赏
转载请附上原文出处链接:胖蔡叨叨叨 » Unexpected aliasing of ‘this’ to local variable.eslint@typescript-eslint/no-this-alias)
分享到: 更多 (0)

请小编喝杯咖啡~

支付宝扫一扫打赏

微信扫一扫打赏