lxyuma BLOG

開発関係のメモ

Marionette.jsのCompositeViewって、どこで使えばいいの?問題

ビール飲みながらダラダラ書いてるので、おかしな所は申し訳ない。

CompositeView

marionette.jsには、CompositeViewというクラスがある。

CollectionViewを継承していて、

  • 再起的な構造を持ったviewを作れる
  • 親側もtemplateを持つ事が出来る

というのが、特徴とかなんとかで、イマイチ使い道のimageが湧かなかった。

普段書くときも、ItemViewとCollectionViewで事足りていた。

が、最近、使い道がやっと分かってきた。

View親子に関係のある親戚のおじさんView

あるViewに親子階層がある時であれば、ItemViewとCollectionViewを紐づければ良い。(ulタグとliタグのイメージ)

これは、このブログでも何度も書いてきた、よく書くパターン。

ところが、この親子に働きかけたい別のView要素が必要になる時がある。

※以降、このViewの事を、その親子の「親戚のおじさんView」と呼ぶ事とする。とりあえず。

シチュエーション

親戚のおじさんViewとは、具体的に言うと、例えば、

  • 検索ボックス
  • タブ

等々。

これらは、親子の階層を持った検索結果のようなViewに対して、そのデータを渡したり、表示を切り替えたりする必要がある。

普通に書くと、event treiggerするか、subview構成にするかで、親子と連携していかないといけない。

結構、手間だし、複雑になって可読性が落ちる恐れが有る。

こういう時に、CompositeViewを使うと良い。

こうすると、今迄、親子と別の家に居た親戚のおじさんが、その親子の家にやってきて、2世代家族になるので、

わざわざ電話かけなくても、そのまま話が出来る!

みかんとかも、そのまま渡せる!

※よくわかんなくなってきた

CompositeViewの効果

親子との連携eventとか、無駄に複雑なsubView構成みたいなのを書かなくて済む。

書いてたら、fatになるんじゃないか?と思われるかもだが、

そんな事も無かった。

そもそも、元々、親子 + 親戚構成だと、親がめっちゃsimpleで親戚にlogicが寄るので、

本当に、連携部分だけ楽出来てる感じ。

この連携部分だけといっても、馬鹿にならない。

自力でこの連携書くと、そこを起因として、また数々のオレオレ実装が出来るので、

やっぱり、これも、汎用的な物を使った方が良い。

まとめ

  • 親子があったら
    • CollectionView
  • 親子の近くに親戚のおじさんがいたら
    • CompositeView