关于vue中@click.native.prevent的说明
更新时间：2022年03月08日 10:07:48 作者：不丸子
这篇文章主要介绍了关于vue中@click.native.prevent的说明，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
关于@click.native.prevent的说明
元素中绑定了这个事件
<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()，父组件想在子组件上监听自己的click的话，需要加上native修饰符。
vue的@click.native.prevent，点击事件加上native.prevent有什么用呢
在项目发版的总结过程中，突然看到@click.native.prevent，很好奇它的用法，一开始还以为是element-ui里面自带了，看了之后也没有啊，上网搜集了资料，打算记录下来。
代码如下
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native.prevent="handleAgencyRelationship(row)">代理关系处理</el-dropdown-item>
</el-dropdown-menu>
elment-ui
我们项目的业务场景的点击事件，是不需要用到按钮的，所以我们需要用到的是原生的vue点击事件。而加native.prevent的精髓就在此
- 给vue绑定组件的时候，需要加一个native,不加的话会被认为是要监听item里面的自定义事件，（显然我们这里不需要）
- 加prevent，是用来阻止默认事件的，相当于Jquery里面的event.preventDefault（）方法阻止元素发生默认的行为。
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
在计算机技术中,指令是由指令集架构定义的单个的CPU操作,在更广泛的意义上,“指令”可以是任何可执行程序的元素的表述,例如字节码,下面这篇文章主要给大家介绍了关于Vue3指令是如何实现的相关资料,需要的朋友可以参考下2022-01-01
这篇文章主要介绍了vue数组对象排序的实现代码，这里整理了详细的代码，非常具有实用价值，需要的朋友可以参考下2018-06-06
VueUse为Vue开发人员提供了大量适用于Vue2和Vue3的基本Composition API 实用程序函数。具有一定的参考价值，感兴趣的可以了解一下2021-11-11
本文介绍了vuejs指令的相关知识，具有很好的参考价值，下面跟着小编一起来看下吧2017-02-02
使用axios请求接口,几种content-type的区别详解
今天小编就为大家分享一篇使用axios请求接口,几种content-type的区别详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-10-10
这篇文章主要介绍了在Vue中创建可重用的 Transition,本文通过示例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-06-06
Vue 中的数据绑定和模板渲染都是异步的，那么如何在更新完成后执行回调函数呢？这就需要用到 Vue 的 nextTick 方法了，本文详细介绍了Vue2和Vue3的nextTick实现原理，感兴趣的同学可以参考一下2023-04-04
这篇文章主要介绍了Vue中Object.assign清空数据报错的解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-03-03
这篇文章主要介绍了vue中动态select的使用方法,结合实例形式分析了vue.js使用动态select创建下拉菜单相关实现技巧与操作注意事项,需要的朋友可以参考下2019-10-10
Element-ui Layout布局(Row和Col组件)的实现
我们在实际开发中遇到一些布局的时候会用到Layout布局，本文就详细的介绍了Element-ui Layout布局(Row和Col组件)的实现，具有一定的参考价值，感兴趣的可以了解一下2021-12-12
最新评论