vue事件修饰符native 的作用

最新推荐文章于 2024-08-15 09:40:56 发布
最新推荐文章于 2024-08-15 09:40:56 发布
阅读量3.6k 收藏 4
点赞数 3
分类专栏： Vue
原文链接：https://blog.csdn.net/qq_29468573/article/details/80771625
版权

转载： https://blog.csdn.net/qq_29468573/article/details/80771625

通俗点讲：就是在父组件中给子组件绑定一个原生的事件，就将子组件变成了普通的HTML标签，不加’. native’事件是无法触 发的。

可以理解为该修饰符的作用就是把一个vue组件转化为一个普通的HTML标签，并且该修饰符对普通HTML标签是没有任何作用的。

陪着月亮
关注
专栏目录
聊聊vue中的修饰符，常用事件修饰符【总结】
m0_60150712的博客
08-02 375
本篇文章会带大家聊一聊vue指令中的修饰符，对比vue中的指令修饰符和dom事件中的event对象，介绍一下常用的事件修饰符，希望对大家有所帮助！
Vue: native事件修饰符的作用
qq_43650979的博客
07-28 495
在父组件中，如果想为子组件绑定一个点击事件，有可能这么写： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js"></script> </head> <body> <div id="app">
Vue组件点击事件不触发的问题，添加事件修饰符native解决
在这里，我分享我的技术心得、项目经验、实用的技术教程、深入的技术分析以及前端开发的最新动态，希望能帮助到更多的人。
03-04 7996
相应的代码会以同样的顺序产生。因此，用 v-on:click.prevent.self 会阻止所有的点击，而 v-on:click.self.prevent 只会阻止对元素自身的点击。关于父子组件通讯的原则，父组件通过prop传递数据给子组件，子组件触发事件给父组件。通俗点讲：就是在父组件中给子组件绑定一个原生的事件，就将子组件变成了普通的HTML标签，不加'. native'事件是无法触发的。不像其它只能对原生的 DOM 事件起作用的修饰符，.once 修饰符还能被用到自定义的组件事件上。
Vue Native：以Vue之名，跨平台移动开发新选择
最新发布
gitblog_01151的博客
08-15 655
Vue Native：以Vue之名，跨平台移动开发新选择 vue-native-coreVue Native is a framework to build cross platform native mobile apps using JavaScript项目地址:https://gitcode.com/gh_mirrors/vu/vue-native-core ????虽然Vue Native项目...
Vue中‘.native‘修饰符的作用
chen__cheng的博客
07-26 7971
一般情况下，父组件要监听子组件的事件，可以通过$emit的方式。但是如果父组件要监听子组件的原生事件，比如：input的focus事件。此时可以通过使用v-on的.native修饰符达到目的。 .native 可以在某组件的根元素上监听一个原生事件 从上面的语句可以看出，.native作用于组件的根元素。 所以如果需要监听的元素是作为根元素，此时.native完全适用 例如： 父组件 <template> <div id="app"> <baseLabel v
Vue_事件修饰符_native
qq_43260366的博客
09-15 269
【代码】Vue_事件修饰符_native。
Vue中native修饰符
qq_42931285的博客
09-28 692
vue中native修饰符
Vue事件修饰符的使用
weixin_41796631的博客
04-13 306
在Vue中，事件修饰符处理了许多DOM事件的细节，让我们不再需要花大量的时间去处理这些烦恼的事情，而能有更多的精力专注于程序的逻辑处理。在Vue中事件修饰符主要有： .stop: 等同于JavaScript中的 event.stopPropagation( )，防止事件冒泡 .capture:与事件冒泡的方向相反，事件捕获由外到内 .prevent:等同于JavaScr...
Vue事件修饰符native、self示例详解
10-16
修饰符native主要应用于子组件上，它的作用是让父组件能够监听到子组件内部的原生事件。在Vue中，当我们在自定义组件上使用不带native的事件时，比如`<Son @click="handler1"></Son>`，实际上是把事件处理器绑定到了...
Vue 按键修饰符处理事件的方法
08-27
Vue 按键修饰符处理事件的方法 Vue 按键修饰符是 Vue 框架中的一种特殊处理事件的方法，它允许开发者轻松地处理键盘事件，无需关心 keyCode 的值。 Vue 按键修饰符主要分为两大类：按键别名和系统修饰键。 按键...
vue事件修饰符native
05-12
`v-on` 指令可以监听 DOM 事件并在触发时运行一些 JavaScript 代码。而 `native` 修饰符则可以让 `v-on` 监听组件根元素的原生 DOM 事件，而不是组件内部...如果在组件内部的元素上使用 `native` 修饰符是不起作用的。
Vue事件修饰符.native及其他
sxq_110
03-02 1041
.stop调用event.stoppropagation()。(阻止事件冒泡) eg:触发子元素事件时不会冒泡影响到外层父元素事件 .prevent调用event.preventDefault()。(阻止默认事件) eg:<input type="submit" v-on:click.stop.prevent="onSubmit"/>提交不重载页面 @keyup监听键盘弹起事件 @keydown监听键盘按下事件 @keyup.enter(键码)监听回车键弹起事件 e...
vue中的.native修饰符
缓慢前行的CV打工人
08-11 3696
native事件修饰符相关技术点
.native事件修饰符
qq_40029822的博客
03-10 761
事件修饰符使用层次升级，写的高大上就显得更牛皮一些
vue中 .native 修饰符的作用
m0_67841039的博客
06-18 971
native
vue 事件中的 .native
热门推荐
cofecode的博客
12-25 3万+
.native是什么？.native - 监听组件根元素的原生事件。 主要是给自定义的组件添加原生事件。例子 给普通的标签加事件，然后加native是无效的<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div
修饰符.native
m0_58861443的博客
08-13 186
修饰符.native .native事件修饰符是用来是在父组件中给子组件绑定一个原生的事件，就将子组件变成了普通的HTML标签看待。 <el-dropdown-item divided @click.native="logout"> <span style="display:block;">退出登录</span> </el-dropdown-item> 并不是所有的组件都支持click 并不是所有的组件都天然的支持click 所有的自定义组件都不支
vue中‘. native‘修饰符的使用
qq_41892236的博客
11-17 2065
vue中’. native’修饰符的使用 .native - 监听组件根元素的原生事件。 主要是给自定义的组件添加原生事件。 官网的解释： 你可能想在某个组件的根元素上监听一个原生事件。可以使用 v-on 的修饰符 .native 。 通俗点讲：就是在父组件中给子组件绑定一个原生的事件，就将子组件变成了普通的HTML标签，不加’. native’事件是无法触 发的(我觉的这个说法一点也不通俗)。 举列说明 这时点击按扭没有任何反应。 这时点击按扭，出现弹窗，如下图： 这里候，就可以很明显的看出.nat
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值