React JSX返回关键字不起作用

Question

我花了2个多小时深刻理解这段经历。

在以下代码段中，return无法按预期工作：

return
<VideoItem
    key={video.etag}
    changeVideo={changeVideo}
    video={video} />;

要获得更多说明，我希望return以及应该在多行中返回的内容。

但下面这行不起作用：

return
<VideoItem key={video.etag} changeVideo={changeVideo} video={video} />;

Answer 1

我的错误是我必须做以下其中一项：

1. 写下return，其余的在一行中：

   return <VideoItem key={video.etag} changeVideo={changeVideo} video={video} />;
   

2. 用括号括起返回的结果：

   return (
       <VideoItem
           key={video.etag}
           changeVideo={changeVideo}
           video={video} />);
   

是的，现代的JS很敏感！

Answer 2

您的所有内容都应该包含在父标记内。 典型的返回语法如下所示：

return (
  <div>
    Everything you do should be here.......
  </div>
);

注意父<div></div>。您可以将其更改为<h1></h1>，<b></b>等