快捷導(dǎo)航

淺談vue中組件綁定事件時(shí)是否加.native

更新時(shí)間：2019年11月09日 09:15:25 作者：254980080

今天小編就為大家分享一篇淺談vue中組件綁定事件時(shí)是否加.native，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧

組件綁定事件時(shí)

1. 普通組件綁定事件不能添加.native, 添加后事件失效

2. 自定義組件綁定事件需要添加.native, 否則事件無效

<template>
 <!-- <mt-field label="用戶名" placeholder="請(qǐng)輸入用戶名"></mt-field> -->
 <input type="text" @keyup.native="show($event)"> //普通組件不能添加.native, 添加后事件失效
</template>

<script>
import { MessageBox } from 'mint-ui';

export default {
 name: 'about',
 data(){
 return{

 }
 },
 methods:{
 show(ev){
  MessageBox.alert('操作成功').then(action => {
  if(ev.keyCode==13){
   console.log('enter');
  }
  });
 }
 }
}
</script>

<template>
 <mt-field label="用戶名" placeholder="請(qǐng)輸入用戶名" @keyup.native="show($event)"></mt-field> //自定義組件需要添加.native, 不添加事件無效
 <!-- <input type="text" @keyup.native="show($event)"> -->
</template>

<script>
import { MessageBox } from 'mint-ui';

export default {
 name: 'about',
 data(){
 return{

 }
 },
 methods:{
 show(ev){
  MessageBox.alert('操作成功').then(action => {
  if(ev.keyCode==13){
   console.log('enter');
  }
  });
 }
 }
}
</script>

以上這篇淺談vue中組件綁定事件時(shí)是否加.native就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

解決vue單頁使用keep-alive頁面返回不刷新的問題
下面小編就為大家分享一篇解決vue單頁使用keep-alive頁面返回不刷新的問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-03-03
Vue?處理異步加載順序問題之如何在Konva中確保文本在圖片之上顯示
在處理Konva中的異步加載順序問題時(shí),確保在圖像加載完成后再添加其他元素是關(guān)鍵,通過將回調(diào)函數(shù)放在imageObj.onload中,并正確處理變量捕獲,我們可以確保文本總是繪制在圖片之上,這不僅解決了顯示順序的問題,也為未來的調(diào)試提供了明確的方向,感興趣的朋友一起看看吧
2024-07-07
vue柱狀進(jìn)度條圖像的完美實(shí)現(xiàn)方案
本文是對(duì)bar進(jìn)度條實(shí)現(xiàn)的2種方案進(jìn)行分享，第一種是很簡(jiǎn)單，純css的實(shí)現(xiàn)，第二種是echart的實(shí)現(xiàn)。對(duì)vue柱狀進(jìn)度條圖像的實(shí)現(xiàn)方案，感興趣的朋友跟隨小編一起看看吧
2019-08-08
Vue Router深扒實(shí)現(xiàn)原理
在看這篇文章的幾點(diǎn)要求：需要你先知道Vue-Router是個(gè)什么東西，用來解決什么問題，以及它的基本使用。如果你還不懂的話，建議上官網(wǎng)了解下Vue-Router的基本使用后再回來看這篇文章
2022-09-09
教你60行代碼實(shí)現(xiàn)一個(gè)迷你響應(yīng)式系統(tǒng)vue
這篇文章主要為大家介紹了教你60行代碼實(shí)現(xiàn)一個(gè)迷你響應(yīng)式系統(tǒng)詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪<BR>
2023-03-03
vue v-for循環(huán)重復(fù)數(shù)據(jù)無法添加問題解決方法【加track-by=''索引''】
這篇文章主要介紹了vue v-for循環(huán)重復(fù)數(shù)據(jù)無法添加問題解決方法,結(jié)合實(shí)例形式分析了vue.js通過在v-for循環(huán)中添加track-by='索引'解決重復(fù)數(shù)據(jù)無法添加問題相關(guān)操作技巧,需要的朋友可以參考下
2019-03-03
Vue filter格式化時(shí)間戳?xí)r間成標(biāo)準(zhǔn)日期格式的方法
今天小編就為大家分享一篇Vue filter格式化時(shí)間戳?xí)r間成標(biāo)準(zhǔn)日期格式的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-09-09
vue組件非單文件組件的使用步驟
組件又分為非單文件組件和單文件組件，一般常用的就是單文件組件，這篇文章主要介紹了vue組件非單文件組件的使用步驟,需要的朋友可以參考下
2023-01-01
Vue通過ref獲取dom元素屬性的方法
這篇文章主要介紹了Vue通過ref獲取dom元素屬性的方法,文中有詳細(xì)的方法介紹,對(duì)大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下
2023-11-11
vue項(xiàng)目中按需引入element-ui的正確實(shí)現(xiàn)方法
這篇文章主要介紹了vue項(xiàng)目中按需引入element-ui的正確實(shí)現(xiàn)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-01-01