vue 的常用事件
事件處理
1.使用 v-on:xxx 或 @xxx 繫結事件，其中 xxx 是事件名； 2.事件的回撥需要配置在 methods 物件中，最終會在 vm 上；
3.methods 中配置的函式，不要用箭頭函式！否則 this 就不是 vm 了；
4.methods 中配置的函式，都是被 Vue 所管理的函式，this 的指向是 vm 或 元件例項物件；
5.@click="demo" 和 @click="demo($event)" 效果一致，但後者可以傳參；
事件修飾符：
1.prevent：阻止預設事件（常用）；
2.stop：阻止事件冒泡（常用）；
3.once：事件只觸發一次（常用）；
4.capture：使用事件的捕獲模式；
5.self：只有 event.target 是當前操作的元素時才觸發事件；
6.passive：事件的預設行為立即執行，無需等待事件回撥執行完畢；
1.prevent：阻止瀏覽器預設事件（常用）
什麼是瀏覽器的預設事件呢？
- a 標籤的跳轉
- form 表單的提交
- 網頁中右鍵單機，會彈出一個選單（你可以試一試）
程式碼
正常來說 當我點選這個 a 標籤之後 會跳轉到百度 可是 他並不是我們想象的樣子
可以看到 是alert彈出框的提示 說明prevent修飾符 發生了作用 阻止了瀏覽器預設事件的呼叫
2.stop：阻止事件冒泡（常用）
直接上程式碼
- 可以看到 給div和 button和設定了點選事件 那麼 stop：阻止事件冒泡到底是啥呢 ？下面解釋
- 我們待會會點選裡面的button 基礎好的小夥伴肯定會知道 會觸發兩次彈出那麼這是為啥呢
- 是因為 產生了冒泡事件
- 可以看到 發生了 兩次彈窗
- 當我們點選了確認之後 第二次提示框出來了
這個在有些場景中可能不適用 那麼我們該如何只讓它 傳送一次彈窗呢？
毋庸置疑 那就是我們的stop：阻止事件冒泡 下面讓我們看看 加上之後的執行效果吧！
執行效果
3.once：事件只觸發一次（常用）
字面意思 只觸發一次
程式碼
這是我們已點選多次的結果
4.capture：使用事件的捕獲模式
所有的操作 點選的都是 最裡面的兒子
先看程式碼
現在給@click新增.capture修飾符
給兒子 加
結果
給爸爸加
結果：
總結：
1. 冒泡是從裡往外冒，捕獲是從外往裡捕。
2. 當捕獲存在時，先從外到裡的捕獲，剩下的從裡到外的冒泡輸出。