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

【问题标题】：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 ...})。

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

【讨论】：

【解决方案3】：

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

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

【讨论】：