render()--组件--纯函数

Posted 2022-02-17 feng9exe

render()

 

当 被调用时，它会检查 和 的变化并返回以下类型之一：

• React 元素。通常通过 JSX 创建。例如，<div /> 会被 React 渲染为 DOM 节点，<MyComponent /> 会被 React 渲染为自定义组件，无论是 <div /> 还是 <MyComponent /> 均为 React 元素。
• 数组或 fragments。 使得 render 方法可以返回多个元素。欲了解更多详细信息，请参阅 fragments 文档。
• Portals。可以渲染子节点到不同的 DOM 子树中。欲了解更多详细信息，请参阅有关 字符串或数值类型。它们在 DOM 中会被渲染为文本节点

• 布尔类型或null。什么都不渲染。（主要用于支持返回 test && <Child /> 的模式，其中 test 为布尔类型。)

render() 函数应该为纯函数，这意味着在不修改组件 state 的情况下，每次调用时都返回相同的结果，并且它不会直接与浏览器交互。

如需与浏览器进行交互，请在 componentDidMount() 或其他生命周期方法中执行你的操作。保持 render() 为纯函数，可以使组件更容易思考。

 

https://zh-hans.reactjs.org/docs/react-component.html#render

 

组件的本质为构建UI单元；

无状态组件可以简化为一个函数；

()

return< ="">

< />

</>

;