什么是React js中的“安装”？

什么是React js中的“安装”？

React的主要工作是弄清楚如何修改DOM以匹配要在屏幕上呈现的组件。

React通过“装载”（将节点添加到DOM），“卸载”（将它们从DOM中删除）和“更新”（对DOM中已经存在的节点进行更改）来做到这一点。

React节点如何表示为DOM节点以及它在DOM树中的出现位置和时间，由顶级API管理。为了更好地了解正在发生的事情，请看一下最简单的示例：

// JSX version: let foo = <FooComponent />;let foo = React.createElement(FooComponent);

那是

foo

什么，你能用它做什么？

foo

目前是一个普通的Javascript对象，大致类似于以下形式（简化）：

{  type: FooComponent,  props: {}}

它当前不在页面上的任何地方，即它不是DOM元素，也不在DOM树中的任何地方，并且除了是React元素节点外，在文档中没有其他有意义的表示形式。
它只是告诉React 如果 呈现此React元素，则屏幕上 需要 显示什么。 __它尚未“安装”。

您可以通过调用告诉React将其“装入”到DOM容器中：

ReactDOM.render(foo, domContainer);

这告诉React现在该显示

foo

在页面上了。React将创建

FooComponent

该类的实例并调用其

render

方法。假设它渲染一个

<div/>

，在这种情况下，React将为其创建一个

div

DOM节点，并将其插入DOM容器中。

创建实例和与React组件相对应的DOM节点并将其插入DOM的过程称为安装。

请注意，通常您只会调用

ReactDOM.render()

挂载根组件。您无需手动“挂载”子组件。每当父组件调用

setState()

，并且其

render

方法说应首次渲染特定的子代时，React会自动将该子代“装载”到其父代中。