js事件委托

本文介绍了JavaScript中的事件冒泡与事件委托原理,强调了事件委托在减少事件绑定和内存消耗上的优点。此外,文章还探讨了Vite相比webpack的快速编译特性,特别是其按需编译import/export的功能。示例代码展示了如何使用事件委托实现卡片组件的点击事件处理。
摘要由CSDN通过智能技术生成

1. 事件冒泡
元素嵌套,当元素触发事件时,他会向上一级一级的向上传递,直到到最外层window

2. 事件委托
把一个元素的事件委托给别的元素(所有外层元素都可以监听他这个事件的触发)

原理:利用事件冒泡来处理委托事件

3. 事件委托的优缺点
减少事件的绑定 节省内存

减少工作量

4. vite快的地方
webpack 会吧所有的代码都编译成我们的 es5,或者es6 每次编译都比较耗时
vite 是有所选择的编译 improt export 

代码如下:

<div @click="carChange">
 
  <van-card
    v-for="item in 9"
    :key="item"
    num="3"
    price="2.00"
    desc="描述信息"
    title="商品标题"
    thumb="https://cdn.jsdelivr.net/npm/@vant/assets/ipad.jpeg"
  >
    <template #tags>
      <van-tag plain type="danger">规格1</van-tag>
      <van-tag plain type="danger">规格二</van-tag>
    </template>
    <templat

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值