ComponentとContainers
Number of word 741
TL;DR
- Reactの場合
- 見た目に必要なものはJSXだけで
Component
である必要はない Component
はライフサイクルを持つContainers
はデータとの関係性を持つ
- 見た目に必要なものはJSXだけで
Functional Component
- Reactのドキュメントを読んでいると
React.Component
をextends して書く必要があるのかと勘違い - DOMの定義を書くことはJSXのsyntaxだけで完結されている
- JSXで書かれたものとCSSを紐付けたもとを 見た目 と記述した場合
- 見た目はどこのデータに紐付けられるか定かでないため、ライフサイクルを自身で定義するべきではない
- データを渡してtreeを構築するために必要な情報を返すだけでよい
- https://github.com/9renpoto/style/pull/228
Component
- ライフサイクルと見た目を紐付けることに集中する
- 自分が実現したいライフサイクルを実現できるか考慮して、コンポーネントの大きさを決める
Containers
- データを紐付けるだけ
- Reduxを使った場合、
Component
とは完全に疎結合に定義できる - ライフサイクルを意識した必要なデータは
Component
の中にあるため、素直にデータを紐付ける - 初期状態の記述には気をつける
まとめ
- 世界はよく考えられている