导出默认值和声明匿名函数合二为一

Question

这是我想做的事情的一个例子，目前抛出一个错误。我不确定我明白为什么，但在一行上导出、分配默认值和分配变量在语法上是不正确的。让它成为匿名函数的好处是我可以使用粗箭头=>并使用and 打开返回值，(而)不是打开{和}to return jsx。

export default let Checkbox = (props) => (
  <div style={styles.checkboxContainer}>
    <input styleName={styles.checkbox} type="checkbox" />
    <span styleName={styles.checkboxStyled}></span>
  </div>
)

有没有办法在一行中完成这一切？有没有一个很好的理由为什么我不能/为什么它不在规范中？

Answer 1

如果需要，您可以为命名导出执行此操作，但不能为默认导出执行此操作。

您的选择是：

• 不要声明变量。毕竟，您只想导出一个值：

  export default (props) => (
      …
  );
  

• 声明变量并将其导出为两个单独的声明：

  let Checkbox = (props) => (
      …
  );
  export default Checkbox;
  

  如果您需要绑定到变量，因为您想（重新）分配给它（如let建议的那样），请使用

  export {Checkbox as default};
  

• 使用适当的函数声明（也绑定局部变量）：

  export default function Checkbox(props) {
      return …
  }
  

  如果不需要，还可以导出未命名的函数声明。