綁定事件

1.@是v-on:的簡寫,通過v-on:指令綁定事件,指定一個methods選項里面定義的方法
調(diào)用方法時,不傳參數(shù),默認(rèn)會將事件對象當(dāng)成參數(shù)傳遞 -->
<button @click='sayHi'>sayHi</button>

  1. 調(diào)用方法時,傳的是什么參數(shù),接的就是什么參數(shù)
    <button @click="sayHello('hello')">sayHi</button>
  2. 調(diào)用方法時,傳遞一個event參數(shù),該參數(shù)就是事件對象 <button @click="sayNice('Nice',event)">sayHi</button>
  3. 當(dāng)前事件處理的代碼比較簡單,可以將代碼直接寫在行內(nèi),注意:只能操作Vue管理的數(shù)據(jù) 
         <p><button @click="age++">年齡++</button></p>
    
  4. 事件修飾符.prevent,用于阻止默認(rèn)行為
    <div class="box" @contextmenu.prevent="showBox">box</div>
  5. .once ,用只綁定一次事件
    <div class="one" @click.once="one">
  6.  事件修飾符.stop,用于阻止冒泡事件 
    
    1.  .self,只能在自身元素上觸發(fā),不能在子元素上觸發(fā)
      
      <div class="two" @click.stop="two"></div>
      </div>
  7. 每次鍵盤彈起都會調(diào)用事件方法
    請輸入關(guān)鍵詞:<input type="text" @keyup="keyup">
  8. 只在回車時,才會調(diào)用
    請輸入關(guān)鍵詞:<input type="text" @keyup.enter='keyup1'>
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容