何だかこのブログでは久々にプログラミングの話をするようだ。 若い頃は毎日のようにプログラミングの記事を書いていた (その片鱗が Qiita に残っている) のに、最近ではほとんど書かない。 若い時より学習意欲が減退してしまったというのもあるが、いくら勉強しても自分のやりたいような仕事ができるとは限らないので直接的に役に立つことが少ないというのがある (あれだけ勉強した Python / Django や Laravel も業務では一度も使えていない)。 それを言い出すとじゃあ転職したほうがいいんじゃないかとかなるかもしれないが、今更そんな気にもならない。
そんなこんなで最近になってようやく Vue.js 3 を試して使い始めた。
Vue 3 の目玉は Composition API らしく Vue 2 の Options API の書き方に比べて結構簡潔になるし何よりネストが浅くなるのがいい。
<script setup> 直下に書いた const や function が <template> 側でそのまま認識したのは感動した。
再利用性が高まるというメリットも書いてあったがそれはまだ感じていない。
Vue 2 で書かれたコードを Vue 3 の Composition API に移行するのはかなり大変そうだが、少なくとも一から書くぶんにはそんなに違和感もない。
強いて言えばググった時にバージョンによって記述が微妙に違うので記事の最新性を確認してから参考にするように務めるといったところか。
まあそれは Vue に限ったことではないのだが。
あと Vuex についてだが使ったプロジェクトで軒並み Vue と Vuex の役割分担がしっかりできていなくてコードがぐちゃぐちゃになるという問題があったので今回は使わずにやってみようかと思って試してみたが、とても無理だった。 Vue はコンポーネント間のデータのやり取りがかなり面倒な印象で、それは Vue 3 でも変わらなかった。 やっぱり Vuex はよっぽど小さいプロダクトでもない限り使わないというわけにはいかないようだ。 であればせめて Vuex は state と mutation のみ使用するとか、機能限定で使うとゴチャゴチャにならなそうな気がする。 今回のプロジェクトではそうしてみようと思った。