【Vue.js】v-onと$refsを使ってクリックごとに数が増えるボタンを作る2つの方法
v-onを使うもの
See the Pen
クリックごとに数が増えるボタン by りっしー (@hiwriterprogram)
on CodePen.
$refsを使うもの
See the Pen
$refsを使ったカウントアップボタン by りっしー (@hiwriterprogram)
on CodePen.
2つの違いは?
1つ目はdataにcountという値を持たせて数を増やしている一方で
2つ目はDOMを直接参照して値を更新しています。
ただし2つ目の場合、DOM自体(ref=countで参照しているもの)は仮想DOMに上書きされてしまうため、v-showで非表示にした後に再び表示させると値は0に戻ってしまいます。