Open2
【vue3】composition api の「関心事の分離」について
composition api の「関心事の分離」の感覚がまだイマイチ分かってない。
eraserMotorPhantomized
がそれ)って感じの分け方をしてる(上記リンク参照)。
自分のイメージとしては「入力とか知らんけどとにかく文字列」を引数として持つメソッドを分離して、コンポーネントが持つ input と computed プロパティプロパティそのものはコンポーネント側が用意、そのロジックは分離したメソッドから拝借するってものなので、そこにズレがある( page とか SFC から分離したロジックが ref とかを持ってるって感覚がもう僕にはよくわからない)。
とはいえ、このモジュールが公開しているインプットとアウトプットをコンポーネントから紐づけてしまえばモジュールが持つ機能をそのまままるっと利用できるというのにはすごく合点がいく。
が、そうなると何処までこいつが持つべきか(上記の場合だと twitterShareUrl
も持つべきなのか?みたいな)の肌感が全くわからなくてめちゃめちゃ不安になる。
vue3 自体は出てから結構時間が経ってるのでその辺の感覚を持ってる人の意見聞いてみたりとか記事読んでみたりしてみたい。
ちなみに今作っているアプリケーションは入力した文字列を beatmania IIDX という音楽ゲームに出てくる eRAseRmOToRpHAntOM という曲名っぽくして表示するだけというツールです。nuxt 3 beta の勉強がてら作ってみた。
これ読んでて
Hook のメリットは, 【ステートを持ったロジックをコンポーネントから抽出して, 単独でテストしたり, また再利用したりできる】ことである
ってところで結構合点がいったかもしれない。