箭头主体周围出现意外的块语句

Posted 2023-02-22

【中文标题】箭头主体周围出现意外的块语句

【英文标题】：Unexpected block statement surrounding arrow body

【发布时间】：2016-07-05 18:06:02

【问题描述】：

我正在使用"eslint-config-airbnb": "^6.1.0", 来保持我的 javascript 干净。

我的 linter 对看似合法的代码不满意：

看起来这可能是ongoing issue。在此期间，是否有人对 OCD 开发人员有任何解决此问题的建议？也许禁用此规则或以其他方式？

【问题讨论】：

为什么单个语句需要 return ...？你可以使用this.state.todos.filter(filterTodo => filterTodo !== todo

您链接到的问题页面很好地解释了这种情况，混乱在哪里？将其标记为错误而不是警告似乎很奇怪，尽管这可能是可以配置的。

【参考方案1】：

单个表达式不需要块语句。

this.state.todos.filter(filterTodo => filterTodo !== todo);

【讨论】：

vscode 也会为单行表达式抛出错误 - image.ibb.co/jUzGRx/Screen_Shot_2018_04_27_at_3_10_46_PM.png

嗯，不，它会引发警告。您可以（并且可能应该）配置的一个

嗯，不确定是否更清晰。

@Jonny 它不再清晰易读。就是这样。

@Jonny 如果您更喜欢冗长的代码而不是其他所有内容，那么您可能根本不喜欢使用箭头函数。对于每个人来说，这个答案和它所针对的问题并没有涉及代码的“易读性”。这几乎是无关紧要的。

【参考方案2】：

要添加 Kevin 答案，该错误与您的 eslint 配置有关。这就是说，如果 arrow-body-style 选项设置为 true，则 OP 是正确的。另一个例子是这样的：

    return this.state.greetings.map((name) => 
        return <HelloWorld key=name name=name />;
    );

没有 arrow-body-style 选项，根据 Kevin 的回答，不需要块语句 ( return ...)。

这实际上提出了一个新问题，即哪种风格更合适。

更多参考：http://eslint.org/docs/rules/arrow-body-style

【参考方案3】：

如果你真的不想在块语句中包装箭头函数，那么你可以关闭。

module.exports = 
  extends: "airbnb-base",
  rules: 
    "arrow-body-style": 0
  ,
  "env": 
    "jest": true
  
;