浅谈vue中组件绑定事件时是否加.native


Posted in Javascript onNovember 09, 2019

组件绑定事件时

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

2. 自定义组件绑定事件需要添加.native, 否则事件无效

<template>
 <!-- <mt-field label="用户名" placeholder="请输入用户名"></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="请输入用户名" @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中组件绑定事件时是否加.native就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用Jquery实现多级下拉框无刷新的联动
Dec 22 Javascript
别了 JavaScript中的isXX系列
Aug 01 Javascript
jquery插件制作 手风琴Panel效果实现
Aug 17 Javascript
js实现杯子倒水问题自动求解程序
Mar 25 Javascript
jquery自定义函数的多种方法
Jan 09 Javascript
jquery用data方法获取某个元素上的事件
Jun 23 Javascript
JS生成某个范围的随机数【四种情况详解】
Apr 20 Javascript
Javascript中内建函数reduce的应用详解
Oct 20 Javascript
js a标签点击事件
Mar 30 Javascript
ES6解构赋值的功能与用途实例分析
Oct 31 Javascript
jQuery实现动态添加和删除input框代码实例
Mar 29 jQuery
Vue程序化的事件监听器(实例方案详解)
Jan 07 Javascript
Vue根据条件添加click事件的方式
Nov 09 #Javascript
浅谈vuex中store的命名空间
Nov 08 #Javascript
解决$store.getters调用不执行的问题
Nov 08 #Javascript
在Vue中使用this.$store或者是$route一直报错的解决
Nov 08 #Javascript
vue.js的状态管理vuex中store的使用详解
Nov 08 #Javascript
vue.js 子组件无法获取父组件store值的解决方式
Nov 08 #Javascript
VUEX采坑之路之获取不到$store的解决方法
Nov 08 #Javascript
You might like
php笔记之:AOP的应用
2013/04/24 PHP
PHP+sqlite数据库操作示例(创建/打开/插入/检索)
2016/05/26 PHP
PHP实现的大文件切割与合并功能示例
2018/04/10 PHP
JSON辅助格式化处理方法
2013/03/26 Javascript
js+css 实现遮罩居中弹出层(随浏览器窗口滚动条滚动)
2013/12/11 Javascript
四种参数传递的形式——URL,超链接,js,form表单
2015/07/24 Javascript
JavaScript实现仿淘宝商品购买数量的增减效果
2016/01/22 Javascript
jQuery基于闭包实现的显示与隐藏div功能示例
2018/06/09 jQuery
AntV F2和vue-cli构建移动端可视化视图过程详解
2019/10/08 Javascript
实例讲解JavaScript 计时事件
2020/07/04 Javascript
JSON 入门教程基础篇 json入门学习笔记
2020/09/22 Javascript
[00:20]TI9不朽观赛名额抽取
2019/08/05 DOTA
python使用PyV8执行javascript代码示例分享
2013/12/04 Python
深入解析Python中的__builtins__内建对象
2016/06/21 Python
关于python写入文件自动换行的问题
2018/06/23 Python
Python3.6.2调用ffmpeg的方法
2019/01/10 Python
PyQt5实现五子棋游戏(人机对弈)
2020/03/24 Python
解决Pytorch 加载训练好的模型 遇到的error问题
2020/01/10 Python
Python基于traceback模块获取异常信息
2020/07/23 Python
scrapy与selenium结合爬取数据(爬取动态网站)的示例代码
2020/09/28 Python
python爬虫如何解决图片验证码
2021/02/14 Python
python爬虫scrapy框架之增量式爬虫的示例代码
2021/02/26 Python
html2 canvas生成清晰的图片实现打印功能
2019/09/23 HTML / CSS
phpquery中文手册
2021/03/18 PHP
英国最大的百货公司:Harrods
2016/08/18 全球购物
万宝龙英国官网:Montblanc手表、书写工具、皮革和珠宝
2018/10/16 全球购物
品管员岗位职责
2013/11/10 职场文书
大学生预备党员自我评价分享
2013/11/16 职场文书
教师的实习鉴定
2013/12/15 职场文书
生物科学专业毕业生求职信
2014/06/02 职场文书
优质服务口号
2014/06/11 职场文书
检讨书模板
2015/01/29 职场文书
学籍证明模板
2015/06/18 职场文书
2015教师个人师德工作总结
2015/10/23 职场文书
《索溪峪的野》教学反思
2016/02/19 职场文书
SQL Server实现分页方法介绍
2022/03/16 SQL Server