Vue.js v-onの使い方

概要

JavaScriptではクリックして何かを実行させる場合にonclickを使用します。
しかし、Vueの場合以下のような処理を実装することはできません。

onclick="{{ value }}++"

そこでv-onという構文を使用します。

記述方法

v-on構文は以下のように記載します。

v-on: イベント名="処理"

実例

例としてクリックするごとに1インクリメントする処理を記述します。

template: '<p v-on:click="value++;" clicked: {{ value }}.</p>'

上記のように書くことでvalue++が認識されるようになります。