ESLint:围绕箭头体的意外的块语句.(箭体样式)

Question

由以下代码片段触发的此规则最令人困惑(对我而言 - 以及其他人看来).如果我移除了卷曲,它就会断裂.如果我在块周围添加parens,它就会中断.该怎么办？

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>
  );