vue中的@click.native 原生点击事件
更新时间：2022年04月22日 09:21:51 作者：有时间织个毛衣
这篇文章主要介绍了vue中的@click.native 原生点击事件，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
@click.native原生点击事件
给vue组件绑定事件时候
必须加上native ，不然不会生效（监听根元素的原生事件，使用 .native 修饰符）
等同于在自组件中
子组件内部处理click事件然后向外发送click事件：$emit("click".fn)
vue点击事件补充.native
发现vue中加载Element 之后 键盘事件无效果搜索之后发现有BUG特来修复
步骤
发现Element-input 中加入@keyup.enter中无效果
<el-input style="width:500px;" placeholder="请输入查询城市" v-model="location" clearable @keyup.enter="goSearch" ></el-input>
之后在加入.native 的修饰符
<el-input style="width:500px;" placeholder="请输入查询城市" v-model="location" clearable @keyup.enter.native="goSearch" ></el-input>
官网的解释
你可能想在某个组件的根元素上监听一个原生事件。可以使用 v-on 的修饰符 .native 。
通俗点讲：
就是在父组件中给子组件绑定一个原生的事件，就将子组件变成了普通的HTML标签，不加’. native’事件是无法触 发的。
可以理解为该修饰符的作用就是把一个vue组件转化为一个普通的HTML标签，并且该修饰符对普通HTML标签是没有任何作用的。
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了vue抽出组件并传值实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-07-07
Vue MVVM模型与data及methods属性超详细讲解
MVVM旨在利用WPF中的数据绑定函数,通过从视图层中几乎删除所有GUI代码（代码隐藏）,更好地促进视图层开发与模式其余部分的分离,这篇文章主要介绍了Vue MVVM模型与data及methods属性2022-10-10
这篇文章主要介绍了Vue Element校验validate的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-09-09
这篇文章主要为大家介绍了Vue中使用Swiper简单封装组件示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-08-08
这篇文章主要介绍了使用Vue动态生成form表单的实例代码,非常不错，具有参考借鉴价值，需要的朋友可以参考下2018-04-04
vue3 拖拽hooks(可兼容移动端)和自定义指令拖拽的实现代码
这篇文章主要介绍了vue3 拖拽hooks(可兼容移动端)和自定义指令拖拽的实现代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考借鉴价值,需要的朋友参考下吧2024-01-01
响应式就是当对象本身(对象的增删值)或者对象属性(重新赋值)发生变化时,将会运行一些函数,最常见的就是render函数,下面这篇文章主要给大家介绍了关于Vue3响应式原理的相关资料,需要的朋友可以参考下2022-12-12
这篇文章主要介绍了vue获取后台json字符串方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
vue3 setup语法糖中获取slot插槽的dom对象代码示例
slot元素是一个插槽出口,标示了父元素提供的插槽内容将在哪里被渲染,这篇文章主要给大家介绍了关于vue3 setup语法糖中获取slot插槽的dom对象的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下2024-04-04
详解Vue+axios+Node+express实现文件上传(用户头像上传)
这篇文章主要介绍了详解Vue+axios+Node+express实现文件上传(用户头像上传)，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-08-08
最新评论