vue render里面的nativeOn的解释官方的解释是:// 仅对于组件,用于监听原生事件,而不是组件内部使用 `vm.$emit` 触发的事件。

官方的解释比较抽象

个人理解:

父组件要在子组件上使用click事件,就像使用正常的html标签那样使用click,我们知道在vue中,我们这样写是没问题的,<h @click="do()"></h>,但是假如我们有一个组件叫comA,

<comA @click="do()"></comA>这样写肯定是不行的(除非子组件里面做了手脚哈),只要加上.native就可以生效<comA @click.native="do()"></comA>

仅用于组件这句话意思是:createElement()里面创建的不可以是原生html元素 而是组件,举例:createElement(‘p’,{nativeOn:{click:function(){}}})这个时候nativeOn就没有意义,而createElement(‘组件名称’,{nativeOn:{click:function(){}}})就会有意义,在最终页面上在该组件上发生了点击事件最终会触发nativeOn里面的Click事件

												

vue render里面的nativeOn的更多相关文章

  1. vue 路由里面的 hash 和 history

    对于 Vue 这类渐进式前端开发框架,为了构建 SPA(单页面应用),需要引入前端路由系统,这也就是 Vue-Router 存在的意义.前端路由的核心,就在于 —— 改变视图的同时不会向后端发出请求. ...

  2. new Vue({ render: h => h(App), }).$mount('#app')

    这里创建的vue实例没有el属性,而是在实例后面添加了一个$mount('#app')方法. $mount('#app') :手动挂载到id为app的dom中的意思 当Vue实例没有el属性时,则该实 ...

  3. 读 vue 源码一 (为什么this.message能够访问data里面的message)

    12月离职后,打算在年后再找工作了,最近陆陆续续的看了黄轶老师的vue源码解析,趁着还有几天过年时间记录一下. 目标:vue如何实现通过this.key,就能直接访问data,props,method ...

  4. vue :class 可以接收 字符串 数组 和 对象 对象里面的key值 根据true或false 显示不显示

    vue :class 可以接收 字符串 数组 和 对象 对象里面的key值 根据true或false 显示不显示 https://cn.vuejs.org/v2/guide/class-and-sty ...

  5. this.$refs.tabs.activeKey ref就是vue里面的id

    this.$refs.tabs.activeKey ref就是vue里面的id

  6. drupal里面的ajax最粗浅的理解-流程

    1,  form里面的ajax所在地表单元素有一个事件,激发system/ajax,相应的有ajax_form_callback(), 会把被改变的元素值传到form_state[values]中, ...

  7. vue项目里的日期格式化

    在项目中,我们经常需要把后台传回的日期进行格式化,可以在common里定义一个公共的js export function formatDate (date, fmt) { if (/(y+)/.tes ...

  8. 如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件

    copy内容的网址: https://segmentfault.com/a/1190000007020623 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要 ...

  9. vue render function

    vue render function https://vuejs.org/v2/guide/render-function.html { // Same API as `v-bind:class`, ...

随机推荐

  1. InnoDB中锁的算法(3)

    Ⅰ.隐式锁vs显示锁 session1: (root@localhost) [test]> show variables like 'tx_isolation'; +-------------- ...

  2. [Day8] eclipse

    快捷键 1.内容辅助键  Alt+/ 2.格式化Ctrl+Shift+f 代码区域右键 -- Source – Format 3. 自动导包: Ctrl+Shift+o 如果当前类在多个包中都存在,这 ...

  3. js多选下拉框

    1.js原生实现 1.1:引用JS文件 /*! jQuery v1.12.4 | (c) jQuery Foundation | jquery.org/license */ !function(a,b ...

  4. ES6 Reflect 与 Proxy

    概述 Proxy 与 Reflect 是 ES6 为了操作对象引入的 API . Proxy 可以对目标对象的读取.函数调用等操作进行拦截,然后进行操作处理.它不直接操作对象,而是像代理模式,通过对象 ...

  5. 7、LwIP协议规范翻译——网络接口

    7.网络接口 在lwIP中,物理网络硬件设备驱动是由类似于BSD网络接口结构表示.网络接口结构如图5所示.网络接口被保存在一个全局的链表中,通过结构体中的next指针来完成链表的链接. 每个网络接口都 ...

  6. @Value("${xxxx}")注解的配置及使用

    代码中的用法 Spring 通过@Value注解获取*.porperties文件code的内容,然后赋值给使用该注解的Code属性上. @Value("${code}") priv ...

  7. 【UML】NO.55.EBook.8.UML.3.001-【UML和模式应用 第3版】

    1.0.0 Summary Tittle:[UML]NO.54.EBook.8.UML.3.001-[UML和模式应用 第3版] Style:DesignPattern Series:DesignPa ...

  8. Tomcat服务安全加固

    Tomcat服务默认启用了管理后台功能,使用该后台可直接上传 war 文件包对站点进行部署和管理.由于运维人员的疏忽,可能导致管理后台存在空口令或者弱口令的漏洞,使得黑客或者不法分子可以利用该漏洞直接 ...

  9. 四、UI开发之核心基础——约束(实用)

    概述 本节将会介绍最常用的几种约束,基本可以满足90%以上的UI布局要求. 先附上一份其他优秀博客https://blog.csdn.net/companion_1314/article/detail ...

  10. OpenStack-Neutron-VPNaaS-测试和使用

    准备 确认安全组规则允许vpn协议通过(tcp协议和icmp协议,测试的时候直接设置“进出”全开) 确认两个子网上的vm可以ping通对方路由的外网ip,确认下两个vm是否可以访问外网 测试环境 (1 ...