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< ="">
< />
</>
;