Vue组件中关于@click.native.prevent事件

最新推荐文章于 2022-09-27 08:24:08 发布
最新推荐文章于 2022-09-27 08:24:08 发布
阅读量1k 收藏 1
点赞数
文章标签： vue.js html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/muyumuyu98/article/details/114819930
版权

一般来说，引用自定义或第三方组件所绑定的事件名都会来自子组件，包括click这种看似默认点击事件的名称。
这是如果直接给父组件绑定@click，子组件没有传click方法过来，那么这个看似click的点击事件将不会执行。
此时就需要用到.native才能使用click点击事件
/
.prevent用于取消默认行为，相当于event.preventDefault()
应用场景，右键自定义操作栏

方沐雨
关注
vue3 emits 选项和.native修饰符
weixin_46161178的博客
06-16 2362
vue3 emits选项
vue @click.native.prevent=“handleLogin“ 和 @keyup.enter.native=“handleLogin“
weixin_49261425的博客
04-13 3052
一、@click.native.prevent="handleLogin 1.在封装好的组件上使用，所以要加上.native才能click 2.prevent就相当于..event.preventDefault() 所以@submit.native.prevent是用来阻止默认行为的 ; 二、@keyup.enter.native="handleLogin" vue运行为v-on在监听键盘事件时，添加了特殊的键盘修饰符： <input v-on:keyup.13="submit">
vue中@click.native.prevent说明
qq_26993175的博客
09-22 1万+
元素中绑定了这个事件 <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">登录</el-button> 1、在封装好的组件上使用，所以要加上.native才能click。 2、prevent是用来阻止默认的事件。就相当于…event.preventDefault()，父组件想在子组件上监听自己的cl
vue 中 @click.native.prevent 事件
m0_59763691的博客
08-21 419
1，在封装好的组件上使用click，必须加上.native。 2，prevent是用来阻止默认的事件。就相当于Jquery里面的event.preventDefault()。
@click.native.prevent
捣蛋的博客
05-08 5733
@click.native.prevent 1.给vue组件绑定事件时候，组件加上.native才能监听原生事件，否则会认为监听的是来自Item组件自定义的事件， 在封装好的组件上使用，所以要加上.native才能click 2.prevent 是用来阻止默认的 ，相当于原生的event.preventDefault() 根据Vue2.0官方文档关于父子组件通讯的原则，父组件通过prop传...
vue中的@click.native.prevent，点击事件加上native.prevent究竟有什么用呢？
kikikiuu的博客
07-22 1万+
在项目发版的总结过程中，突然看到@click.native.prevent，很好奇它的用法，一开始还以为是element-ui里面自带了，看了之后也没有啊，上网搜集了资料，打算记录下来。 代码如下： <el-dropdown-menu slot="dropdown"> <el-dropdown-item @click.native.prevent="handleAgencyRelationship(row)">代理关系处理</el-dropdown-item.
vue组件添加事件@click.native操作
01-21
2，等同于在子组件中： 子组件内部处理click事件然后向外发送click事件：$emit(“click”.fn) <Item xss=removed></Item> 补充知识：vue——组件间（兄弟组件间）事件派发与接收 法一 main.js 在初始化vue之前，给...
vue @click.native.prevent的作用
06-06
`@click.native.prevent` 是 Vue.js 框架中的一个事件修饰符，它的作用是阻止元素的默认行为和事件冒泡。其中，`.native` 修饰符用于监听组件根元素的原生事件，`.prevent` 修饰符用于防止默认行为。 举个例子，...
@click.native.prevent="handleLogin" native 报错
07-12
如果在Vue中使用`@click.native.prevent`时遇到报错，可能是因为该修饰符不被支持或存在语法错误。在Vue中，`@click.native`用于监听元素的原生点击事件，而`.prevent`用于阻止事件的默认行为。 如果你想要同时使用...
@click.native.prevent 和 @click的区别
最新发布
08-23
@click.native.prevent 是 Vue.js 框架中的指令，用于阻止元素上的默认行为。它会在事件触发时调用 event.preventDefault() 来阻止浏览器默认的行为，比如提交表单或者跳转链接。这个指令通常用于处理用户交互的元素...
Vue中@click.stop与@click.prevent、@click.native
qq_40925546的博客
06-21 8449
Vue中@click.stop与@click.prevent、@click.native
@click-native-prevent
热门推荐
caimaomaocai的博客
07-25 2万+
看到这个@click.native.prevent有点懵逼， 然后查了点资料，还是零零散散的资料。。自己总结一下   1.在封装好的组件上使用，所以要加上.native才能click 2.prevent就相当于..event.preventDefault()   所以@submit.native.prevent是用来阻止默认行为的 ;...
vue学习笔记7-事件修饰符
清砾的博客
10-27 354
vue中事件修饰符有6个 ：.stop .prevent .capture .self .once .passive 在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。 尽管我们可以在方法中轻松实现这点，但更好的方式是：方法只有纯粹的数据逻辑，而不是去处理 DOM 事件细节。 为了解决这个问题，Vue.js 为 v-on 提供了事件修饰符。 修饰符是由点开头的指令后缀来表示的。 .stop 阻止冒泡事件 .preve
vue @click和 @click.native.prevent 区别
Z_Gleng的博客
04-10 1951
@click是用在按钮上的语法糖 而@click.native是给vue组件绑定事件时候，必须加上native ，否则会认为监听的是来自Item组件自定义的事件 prevent是用来阻止默认的事件。就相当于…event.preventDefault()，父组件想在子组件上监听自己的click的话，需要加上native修饰符。 这里说说默认事件 默认事件就是默认执行的事件，比如a标签，点击a标签，页面会自动跳转 ...
.native.prevent是什么意思？
qq_42931285的博客
09-27 1629
.native.prevent是什么意思？
@click.prevent.native作用
qq_52915594的博客
06-10 1120
@click.prevent.native作用 vue语法
@click.native.prevent解答
qq_39874538的博客
05-26 1150
@click:绑定按下事件 native:在组件的标签中使用，否则@click会被视作从监听的是来着组件的自定义事件 例如:router-link的作用是单纯的路由跳转，会阻止click事件，你可以试试只用click不用native,事件是不会触发的。此时加上.native，才会触发事件。 prevent:阻止默认事件 ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值