「.NET 開発基盤部会 Wiki」は、「Open棟梁Project」,「OSSコンソーシアム .NET開発基盤部会」によって運営されています。
目次 †
概要 †
4thステップ では、コンポーネント分割について。
コンポーネント分割 †
フォルダ †
下記コンポーネントのフォルダは分けても分けなくてもイイ。
タイミング †
アンチパターン †
多数のRenderXXX †
コンポーネント分割中毒 †
propの展開し過ぎ †
手順１ †
トレードオフ †
方針 †
サンプルの実装 †
2020年4月、開示予定
参考 †
手順２ †
- Containerの分割（Container in Container）も可能である模様。
トレードオフ †
例えば、
- Containerで２つのコンポーネント、ComponentAとComponentBを表示する場合...、
- コンポーネントが増えていくとその分必要なハンドラやプロパティが増える。
- mapStateToProps? と mapDispatchToProps? が肥大化してしまい見通しが悪くなる。
- しかし、全コンポーネントを connected にするとやり過ぎになるので適切な単位で分割する。
- データフェッチしていた箇所だけを元のContainerに残す。
- ComponentA、B に関するプロパティとハンドラーをそれぞれ ContainerA、B に分割する。
など。
方針 †
- ルートのContainer
- には、mapStateToProps?, mapDispatchToProps?を定義ぜず、
- ComponentにConnectしない。
- DOMのRenderを実装する。
- 子のContainer
- には、mapStateToProps?, mapDispatchToProps?を定義し、
- ComponentにConnectする。
- Component側にDOMをRenderを実装する。
サンプルの実装 †
2020年4月、開示予定
参考 †
参考 †
Qiita †
mizchi's blog †
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
