1 <!-- 方法處理器 -->
2 <button v-on:click="doThis"></button>
3 <!-- 內聯語句 -->
4 <button v-on:click="doThat('hello', $event)"></button>
5 <!-- 縮寫 -->
6 <button @click="doThis"></button>
7 <!-- stop停止冒泡 -->
8 <button @click.stop="doThis"></button>
9 <!-- 阻止默認行為.prevent 修飾符告訴 v-on 指令對於觸發的事件調用 event.preventDefault() -->
10 <button @click.prevent="doThis"></button>
11 <!-- 阻止默認行為，沒有表達式 -->
12 <form @submit.prevent></form>
13 <!-- 串聯修飾符 -->
14 <button @click.stop.prevent="doThis"></button>
15 <!-- 鍵修飾符，鍵別名 -->
16 <input @keyup.enter="onEnter">
17 <!-- 鍵修飾符，鍵代碼 -->
18 <input @keyup.13="onEnter">
19
20 <!-- 阻止單擊事件冒泡 -->
21 <a v-on:click.stop="doThis"></a>
22 <!-- 提交事件不再重載頁面 -->
23 <form v-on:submit.prevent="onSubmit"></form>
24 <!-- 修飾符可以串聯 -->
25 <a v-on:click.stop.prevent="doThat"></a> v-on:click.prevent.self 會阻止所有的點擊，而 v-on:click.self.prevent 只會阻止對元素自身的點擊
26 <!-- 只有修飾符 -->
27 <form v-on:submit.prevent></form>
28 <!-- 添加事件偵聽器時使用事件捕獲模式 -->
29 <div v-on:click.capture="doThis">...</div>
30 <!-- 只當事件在該元素本身（而不是子元素）觸發時觸發回調 -->
31 <div v-on:click.self="doThat">...</div>
32 <!--只觸發一次-->
33 vue2.1新增，也有 v-once
34 <a v-on:click.once="doThis"></a> @click.native 可以在 router-link 中使用原生事件
35 全部的按鍵別名：
36 @keyup.enter=""
37 .tab
38 .delete (捕獲 “刪除” 和 “退格” 鍵)
39 .esc
40 .space
41 .up
42 .down
43 .left
44 .right
45
46 2.1.0 新增
47 .ctrl
48 .alt
49 .shift
50 .meta
1 多個class綁定[]，類似jq.addclass
2 <div id="app" class="bor" :class="[colr,bgo]">
3 v-model.lazy離開焦點生效
4 v-model.trim去首尾空格
5
6 使用v-if/else會影響內部數據,需要v-model:key標識，:key相同的文本一起單獨渲染
7 <div v-if="name == 'yuge'">
8 用戶名：<input :key="1" type="text">
9 </div>
10 <div v-else>
11 密碼：<input :key="2" type="text">
12 </div>
13 <input type="text" v-model="name">
14 data () {return {name:'yuge'}}
15 tip:輸入yuge或其他切換用戶名、密碼,key分開渲染
16
17 $set/Vue.set動態生成數據的控制
18
19 directives自定義指令對DOM元素進行底層操作：https://cn.vuejs.org/v2/guide/custom-directive.html 獲取dom用ref
20
21 鈎子直譯hook，事件劫持機制，比事件執行更早。
1 beforeRouteEnter(to,from,next){
2 //在渲染組件的對應路由被confirm前調用，不能獲取組件實例this，鈎子未執行，組件實例也未被創建
3 }
4 beforeRouteLeave(to,from,next){
5 //導航離開該組件的對應路由時用，可用this
6 }
v-model.lazy 只有在input輸入框發生blur事件時才觸發
v-model.trim 去除首尾空格
v-model.number 輸入的字符串轉換成number
