vue本身不做事件代理(react将所有事件都委托到document上,然后进行派发)

  1. 普通html元素和在组件上挂了.native修饰符的事件。最终EventTarget.addEventListener()挂载事件
  2. 组件上的,vue组件实例上的自定义事件(不包括.native)会调用原型上的$on,$emit(包括一些其他api $off,$once等等)

vue自身没有做事件代理,如果需要,则直接代理到父节点

<ul @click="meths">
<li v-for="(item,key) in 10" :key="key" :data-index="key">{{item}}</li>
</ul> meths(e) {
if (e.target.nodeName.toLowerCase() === 'li') {
console.log(e.target.innerHTML)
console.log(e.target.dataset)
}
}

事件代理作用主要是 2 个

  1. 将事件处理程序代理到父节点,减少内存占用率
  2. 动态生成子节点时能自动绑定事件处理程序到父节点

vue 在 v-for 时给每项元素绑定事件需要用事件代理吗?为什么?的更多相关文章

  1. Vue方法中修改数组某一项元素而不能响应式更新

    <template> <div> <ul> <li v-for="(item, i) in ms" :key="i"& ...

  2. 【vue】vue使用Element组件时v-for循环里的表单项验证方法

    转载至:https://www.jb51.net/article/142750.htm标题描述看起来有些复杂,有vue,Element,又有表单验证,还有v-for循环?是不是有点乱?不过我相信开发中 ...

  3. vue隐藏APP启动时显示的{{}}

    vue隐藏APP启动时显示的{{}} vue组件在编译好之前会显示{{msg}},在官网上找到这个

  4. 为什么VUE注册组件命名时不能用大写的?

    这段时间一直在弄vue,当然也遇到很多问题,这里就来跟大家分享一些注册自定义模板组件的心得 首先"VUE注册组件命名时不能用大写"其实这句话是不对的,但我们很多人开始都觉得是对的, ...

  5. vue中使用swiper-slide时,循环轮播失效?

    前言 vue 项目中使用时,组件swiper-slide 如果用v-for循环的话,loop:true 就不能无缝轮播,每次轮播到最后一张就停止了??? 正文 代码如下: <swiper :op ...

  6. VUE.JS 窗口发生变化时,获取当前窗口的高度。

    VUE.JS # 窗口发生变化时,获取当前窗口的高度. mounted () { const that = this; window.onresize = () => { return (() ...

  7. Vue路由开启keep-alive时的注意点

    Vue路由开启keep-alive时的注意点   这个不是业务的要求,但是看到每次进入页面就重新渲染DOM然后再获取数据更新DOM,觉得作为一个前端工程师有必要优化下的加载逻辑,正好vue提供了 ke ...

  8. Vue微信自定义分享时安卓系统config:ok,ios系统config:invalid signature签名错误,或者安卓和ios二次分享时均config:ok但是分享无效的解决办法

    简述需求:要求指定页面可以进行微信自定义分享(自定义标题,描述,图片,链接),剩下的页面隐藏所有基础接口.二次分享依然可以正常使用,切换至其他页面也可以正常进行自定义分享. 这两天在做微信自定义分享的 ...

  9. 【Vue | ElementUI】Vue离开当前页面时弹出确认框实现

    Vue离开当前页面时弹出确认框实现 1. 实现目的 在某种业务场景下,用户不允许跳转到其他页面.于是,需要在用户误操作或者是点击浏览器跳转时提示用户. 2. 实现原理 使用路由守卫beforeRout ...

  10. 解决Vue编译和打包时频繁内存溢出情况CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory

    解决Vue编译和打包时频繁内存溢出情况CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory 如上图所示:频繁出现此 ...

随机推荐

  1. Android集成并开启手写笔识别

    1.首先,需要下载Pdf xchange View SDK,然后将其集成到Android项目中: 2.在Android项目中,添加以下依赖: implementation 'com.github.PD ...

  2. docker部署opengauss

    下载二进制包到/opt/software/ wget https://opengauss.obs.cn-south-1.myhuaweicloud.com/1.1.0/x86/openGauss-1. ...

  3. Linux 第五节(特殊权限,隐藏权限,SU,SUDO,FHS文件系统层次化标准)

    特殊权限 SUID  执行者临时获取命令的所有权限(对程序进行设置) SGID  目录内新文件所有组,继承原有目录所有组的名称 SBID  粘滞位,保护位 chmod +权限  文件 chmod   ...

  4. 软件架构易用性在软件UI中的体现

    软件架构易用性在软件UI中的体现 贾硕航 (石家庄铁道大学,河北省石家庄市,050000) 摘要:易用性(usability)是一种以使用者为中心的设计概念,易用性设计的重点在于让产品的设计能够符合使 ...

  5. ubuntu22.04安装 kubernetes(docker)

    初始化检查 操作系统:ubuntu22.04 LTS docker:20.10.18 kubelet: v1.23.6 kubeadm:v1.23.6 kubectl: v1.23.6 1.校准时间: ...

  6. C# IObservable与IObserver通知机制 观察者模式(推式模型)

    using System; using System.Collections.Generic; using System.Linq; using System.Threading; using Sys ...

  7. Win11右键默认显示更多选项的设置

    怎么让Win11右键默认显示更多选项?有很多朋友不喜欢win11系统的右键菜单显示,经常需要多点一次"显示更多选项"才能看到想要的内容,大家想知道如何让win11右键菜单默认显示更 ...

  8. 浅谈Redis与分布式锁

    为什么需要分布式锁 Redis如何实现分布式锁 如何避免死锁? 锁被别人释放怎么办? 锁过期时间不好评估怎么办? Redlock 真的安全吗 为什么要在多个实例上加锁? 为什么大多数实例加锁成功,才算 ...

  9. [Oracle19C ASM管理] ASM的存储管理

    安装过程中,选择的OMF自动管理文件.可以看到存储放在ASM的根下. SQL> show parameter db_create_file_dest; NAME TYPE VALUE db_cr ...

  10. R语言主成分PCA、因子分析、聚类对地区经济研究分析重庆市经济指标|附代码数据

    全文下载链接:http://tecdat.cn/?p=27515 最*我们被客户要求撰写关于主成分PCA.因子分析.聚类的研究报告,包括一些图形和统计输出. 建立重庆市经济指标发展体系,以重庆市一小时 ...