【Vue.js】transition ラッパーは単一要素/コンポーネントで使うと言う話とか - Qiita

Vue.js のtransitionについて。 単一要素はtransitionで複数要素はtransition-groupと言う単純な覚え方ではアカンと思ったので、覚書。 前置き transitionは Vue.js で、 遷移とか移り変わりの表現をいい感じにしてくれるラッパーコンポーネントである。 要素のフェードイン / フェードアウトを簡単に実装する事が出来るので、そう言う例が多く見られるが、 要するにvueが用意してくれているトランジションクラス（v-enterとかv-leaveとか）を用いて、要素がDOMに追加、更新、削除される意図したタイミングでアニメーションを指定する事が出来る。 本題 transitionでラップ出来るのは次のようなケース ・条件付きの描画 (v-if を使用) ・条件付きの表示 (v-show を利用) ・動的コンポーネント ・コンポーネントルートノード (