render

ReactElement render()

render()メソッドは、React.createClass()に提供する仕様オブジェクトで必須とされます。

render()が呼び出された際に、this.propsthis.stateを検証し、 単一の子要素を返す必要があります。 この子要素はネイティブDOMコンポーネントの仮想的な形式(<div />またはReact.DOM.div()のような)、 または自身で定義した別の複合コンポーネントにすることが出来ます。

また、何も描画したくないことを指し示すnullまたはfalseを返すことが可能です。 裏ではReactは現在の差分(相違?)アルゴリズムで動作させるために、<noscript>タグを描画します。 nullまたはfalseを返すと、React.findDOMNode(this)を返します。

render()関数は純粋(pure)であるべきです。 これはコンポーネントのstateを変更せず、それぞれの実行時には同じ結果が返り、 DOMからの読み込みをしない、DOMへの書き込みをしない、 もしくはブラウザとの相互作用による処理(例えば、setTimeout)を行わないという意味です。 もしブラウザとの相互作用の処理が必要な場合は、 代わりにcomponentDidMount()内、または別のライフサイクルのメソッド内で行って下さい。 render()を純粋に保つことで、サーバーでの描画(レンダリング)がより実用的になり、 コンポーネントの処理を推察しやすいものにします。

 Back to top

© 2013-2017 Facebook Inc.
Documentation licensed under CC BY 4.0.

このページは、ページトップのリンク先のReact内のページを翻訳した内容を基に構成されています。 下記の項目を確認し、必要に応じて公式のドキュメントをご確認ください。 もし、誤訳などの間違いを見つけましたら、 @tomofまで教えていただければ幸いです。

  • ドキュメントの情報が古い可能性があります。
  • "訳注:"などの断わりを入れた上で、日本人向けの情報やより分かり易くするための追記を行っている事があります。