我是React和ES6语法的新手，我发现有趣的是，如果我写的是：
return <input onChange={event => console.log(event.target.value);} />;
这是行不通的。我收到“找不到模块”错误。
但是，如果我在箭头函数中删除了分号：
return <input onChange={event => console.log(event.target.value)} />;
它工作正常。如果我保留分号但加了大括号，则：
return <input onChange={event => { console.log(event.target.value); }} />;
这也可以。上面第一个示例不起作用的原因是什么？
为了正确理解为什么会发生这种情况，请确保我们知道 expression 和 block 之间的区别。
在最基本的层次上， 表达式 是一些代表某种值的代码。所以123，a + b + c，calculateSomething()，这些都是表达式。表达式中不包含分号。
123
a + b + c
calculateSomething()
一个 块 在JS是语句列表。这些语句用花括号括起来{ }，并用分号分隔。
{ }
语句通常由表达式和分号组成。所以，
a = b + c;
是一个声明。还有其他类型的语句：let，var，for，while，return，等。
let
var
for
while
return
现在，回到箭头功能。箭头功能可以有两种形式：
(some, args) => <an expression> (some, args) => { <a statement>; <a statement>; ... }
请注意，第一种形式采用一个 表达式 ，即一个 表达式 。如果您使用的是 block ，则应该只有分号，例如第二种形式。
JSX的工作方式如下：
<input onChange={ <an expression> } />
您将所需的道具名称，等号和大括号内的单个表达式放在一起。请记住，单个表达式没有分号。
箭头函数是一个表达式。所以，如果您要在此处放置分号…
<input onChange={ () => 'hello' ; } />
JS将看到该表达式，然后在其后看到分号并崩溃，因为它不应该在那里。
