Skip to content

Instantly share code, notes, and snippets.

@kenmori
Last active May 11, 2019 23:53
Show Gist options
  • Save kenmori/7996ff836bf4ec5f08088eff55c1442d to your computer and use it in GitHub Desktop.
Save kenmori/7996ff836bf4ec5f08088eff55c1442d to your computer and use it in GitHub Desktop.
ReactのMountとは何か(What is “Mounting” in React js?)

ReactのMountとは何か

What is “Mounting” in React js?

This process of creating instances and DOM nodes corresponding to React components, and inserting them into the DOM, is called mounting.

Reactコンポーネントに対応するインスタンスとDOMノードを作成し、それらをDOMに挿入するこのプロセスがマウントと呼ばれます。

const foo = <Child /> //これはcreateElementをして。 JavaScriptオブジェクトになった状態。これをスクリーン上に表示する必要がある

const Parent = () => {
  render(<div><Child></div>) //ここでReactはただのJavaScriptオブジェクトを、DOMNodeにして、親のDOMに挿入している。
}

// この後ParentがMountして、renderが実行された時、ChildのcomponentDidMountが呼ばれる

通常はReactDOM.render()を呼び出してルートコンポーネントをマウントするだけです。 子コンポーネントを手動で「マウント」する必要はありません。 親コンポーネントがsetState()を呼び出し、そのrenderメソッドが特定の子を初めてレンダリングするように指示するたびに、Reactは自動的にこの子をその親に「マウント」します。

Kenji Morita

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment