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. rocketMQ安装部署详细解析

    近来研究了Apache开源项目rocketMQ(原为阿里项目),并在两台linux服务器上完成了部署,现在整理下,供大家参考学习. 一.简介rocketMQRocektMQ是阿里巴巴在2012年开源的 ...

  2. 移动前端开发和 Web 前端开发的区别

    http://www.itcast.cn/news/20180125/16033584753.shtml 1,普通PC端开发与移动端开发区别. 先说背景,我大言不惭的说一下,我pc端的前端开发干了有快 ...

  3. axios跨域请求报错

    在nodejs的入口js中的配置路由之前加入这一段就可以了 app.all('*', function(req, res, next) { res.header("Access-Contro ...

  4. 变量存储缓存机制 Number (int bool float complex)

    # ###变量存储的缓存机制(为了节省空间) #Number (int bool float complex) # (1) int -5~正无穷范围内 var1 = 18 var2 = 18 var1 ...

  5. python tuple的函数

    1. len(tuple) 计算元组元素个数 >>> tuple1 = ('Google', 'Runoob', 'Taobao') >>> len(tuple1) ...

  6. python数据结构-如何统计序列中元素的频度

    如何统计序列中元素的频度 问题举例 如何找出随机序列[1, 5, 6, 5, 3, 2, 1, 0, 6, 1, 6]中出现频度最高的3个元素? 如何统计某篇英文文章中词频最高的5个单词? 将序列转换 ...

  7. Python sys.argv[]用法

    sys.argv,其实就是一个list,它是sys模块下的一个全局变量,第一个元素是模块名.后面是依次传入的参数. 比如可以这样传入 pyton temp.py a b c d,一共传入a.b.c.d ...

  8. 外网无法ip访问服务器解决方法 (原)

    示例ip:119.75.1.1      windows server示例 一.检查网络是否通畅     打开dos窗口(windows+r , 输入cmd回车  )输入命令: ping 119.75 ...

  9. C++ const用法 尽可能使用const

    C++ const 允许指定一个语义约束,编译器会强制实施这个约束,允许程序员告诉编译器某值是保持不变的.如果在编程中确实有某个值保持不变,就应该明确使用const,这样可以获得编译器的帮助. 1.c ...

  10. Windbg程序调试系列1-常用命令说明&示例

    Windbg程序调试是.Net高级开发需要掌握的必备技能,分析内存泄露.分析高CPU.分析线程阻塞.分析内存对象.分析线程堆栈.Live Dedugging.这个领域可以说一个技能+场景化应用的结合, ...