javascript - ESLint:围绕箭头主体的意外 block 语句。 (箭体式)

Question

此规则由以下代码片段触发，最令人困惑(对我和其他人来说)。如果我去除 curl ，它就会破裂。如果我在 block 周围添加括号，它就会中断。怎么办？

const MainLayout = (props) => {
  return (
    <div className="main">
      <Header />
      <Navbar />
      <Content>
        {props.children}
      </Content>
      <Footer />
    </div>
  );
};

这是 ESLint v4.13.1

Answer 1

如果您只是立即返回一个值，则不需要在箭头函数中使用 return 语句。只需将值直接放在箭头后面即可。

当只有一个参数时，您不需要在参数列表周围加上括号。

const MainLayout = props => (
    <div className="main">
      <Header />
      <Navbar />
      <Content>
        {props.children}
      </Content>
      <Footer />
    </div>
  );