December 2017
Intermediate to advanced
329 pages
6h 9m
Chinese
Content preview from React学习手册
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.
68
｜
第
4
章
子节点
ReactDOM
允许用户将一个独立的元素渲染到
DOM
上。
注
6
React
会使用
data-
reactroot
对它进行标记。所有其他的
React
元素都可以通过嵌套的方式合成到上述独
立元素中。
React
是采用
props.children
渲染子元素的。在上一节中，我们已经将一个文本元
素作为
h1
标签的子元素进行渲染了，并且
props.children
的值被设置为了“
Baked
Salmon
”。我们还可以将其他
React
元素渲染为子元素，继而创建一个元素树。这也
是我们使用组件树这个术语的原因。这棵树包含一个根组件，同时衍生出很多分支。
接下来看看包含若干食材成分的无序列表，如示例
4-4
所示。
示例
4-4
：食材成分列表
<ul>
<li>1 lb Salmon</li>
<li>1 cup Pine Nuts</li>
<li>2 cups Butter Lettuce</li>
<li>1 Yellow Squash</li>
<li>1/2 cup Olive Oil</li>
<li>3 cloves of Garlic</li>
</ul>
在这个示例中，无序列表是根元素，它包含
6
个子节点。我们可以使用
React.
createElement
来表示这个
ul
和它的子节点（参见示例
4-5
）。
示例
4-5
：
React
元素表示的无序列表
React.createElement(
"ul",
null,
React.createElement("li", ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.