路漫漫其修遠兮,吾將上下而求索

0%

v-bind 與 v-on 的縮寫

最近在學vue.js,順便記錄一下
v- 是vue.js 在操作 DOM 時的前綴符號,但對於某些會經常使用到的指令來說似乎特別繁瑣
因此vue.js 對 綁定事件屬性 的操作簡化成以下的寫法

v-on

1
2
3
4
5
<!-- 完整寫法 -->
<button v-on:click='clickme'>Click Me</button>

<!-- 縮寫 -->
<button @click='clickme'>Click Me</button>

v-bind

1
2
3
4
5
<!-- 完整寫法 -->
<a v-bind:href='#'>link</a>

<!-- 縮寫 -->
<a :href='#'>link</a>