Question

我很难理解以下ES6语法。我阅读了很多文档，似乎这里发生了不止一个变化：

const renderInput = props =>
  <div>
    <label>{props.placeholder}</label>
  </div>

以上是否相当于：

const renderInput = function renderInput(props) {
  return <div>
           <label>{props.placeholder}</label>
         </div>
}

Answer 1

是的，这是正确的。如果只有一个表达式，并且它是您希望从函数返回的表达式，则可以省略大括号。

因为print "\nThe object" "The Mask" "is at index: ", list1.index("The Mask")实际上是单个表达式（它被转换为<div><label>{props.placeholder}</label></div>或类似的东西），并且您希望从React.createElement(......)返回它，这确实是如何你使用箭头函数的无括号版本。

如果您希望使用变量或进行其他计算（条件，循环等），您将无法省略括号。

ES6箭头功能没有括号

1 个答案: