我與VueJs第3天_VueJs的宣告式和jQuery命令式風格撰寫比較_v-on點擊事件

 

jQuery命令式渲染

一個口令一個動作(要寫比較多條程式)

See the Pen by Jacob (@dryjoker) on CodePen.

Vue.Js宣告式渲染

告訴我目標我自己會舉一反三知道要怎麼做

See the Pen vue.js_宣告誓渲染 by Jacob (@dryjoker) on CodePen.

藉此可看出vue.js宣告式會自行去更新已綁定的部分

而jQuery還需要額外寫程式來更新文字內容

在這裡我們透過 v-on來去註冊點擊事件

而事實上

<button v-on:click="doSomething"> </button>

也可以縮寫替換成

<button @click="doSomething"> </button>

而之前篇章介紹到的v-bind

https://coolmandiary.blogspot.com/2020/08/vuejspart2html-tagv-dind.html

<a v-bind:href="url" >....</a>

則是可縮寫為

<a :href="url" >....</a>