Reactjs 围绕箭头体的意外块语句

我正在使用

“eslint config airbnb”：“^6.1.0”，

来保持我的JavaScript干净

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

---

看来这可能是一个错误。有没有人对强迫症开发者在这段时间内如何解决这个问题有什么建议？可能是禁用此规则还是其他方式？

单个表达式不需要block语句

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

---

要添加Kevin answer，错误与您的eslint配置有关。这就是说，如果

箭头主体样式

选项设置为true，则OP是正确的。另一个例子如下：

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

返回此.state.greetings.map（（名称）=>{
返回；
});

没有

箭头体样式

选项，根据答案，不需要块语句（

{return…}

）

这实际上开启了一个新的问题，即哪种风格更合适

---

进一步参考：

如果您确实不想在block语句中包装arrow函数，则可以关闭

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

---

为什么单个语句需要

{return…}

？您可以使用

this.state.todos.filter（filterTodo=>filterTodo！==todo

您链接到的问题页面很好地解释了这种情况，混淆在哪里？它将此标记为错误而不是警告，虽然这可能是可以配置的。vscode也会对单行表达式抛出错误-呃，不，它抛出警告。您可以一个（可能也应该）配置HMMM不确定是否更清晰。@Jonny它没有多少清晰可辨。它就是这样。@Jonny如果你更喜欢详细的代码而不是其他任何东西，那么你可能更喜欢不使用箭头函数。对于每个人自己，这个答案和它的问题都不涉及“清晰”程度代码是，基本上是无关的。