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

Answer 2

您不需要 retun ，只需添加（而不是 {。 这样...

const Card = props => (
  <View style={styles.containerStyle}>{props.children}</View>
);