#vue# vue阻止事件冒泡

news/2024/7/20 1:02:06 标签: vue.js, css, 小程序, uni-app, 前端

需求/问题:

父盒子设置了一个点击事件,子盒子也设置了一个点击事件,

为了不点击子盒子时,会触发父盒子的点击事件,

在这个时候,我们需要设置阻止冒泡事件

方法:

只需要在子盒子的点击事件里,加stop就可以起到阻止的效果

@click.stop=""
<div @click="toDetail"> // 父盒子
    <div @click.stop="toPreDetail"></div> //子盒子1
    <div></div> //子盒子2
</div>

​​​​​​


http://www.niftyadmin.cn/n/615206.html

相关文章

.Net Core中的Api版本控制

简介 Api的版本控制是Api开发中经常遇到的问题, 在大部分中大型项目都需要使用到Api的版本控制 在本篇博客中&#xff0c;我们将说明一下如何在.Net Core Api项目中使用Api版本控制。 本篇博客中测试项目的开发环境&#xff1a; Visual Studio 2019.Net Core 2.2 SDK使用Nuget安…

微信小程序开发流程(附思维导图)

一.工具 HBuilder X 介绍 HBuilderX内置相关环境&#xff0c;开箱即用&#xff0c;无需配置nodejs 安装下载App开发版&#xff0c;可开箱即用&#xff1b;如下载标准版&#xff0c; 在运行或发行uni-app时&#xff0c;会提示安装uni-app插件&#xff0c;插件下载完成后方…

#uni-app#常用函数/api

&#xff08;1&#xff09;tap"": 由手指单击所触发的事件 &#xff08;2&#xff09;setTimeout&#xff1a;设定一个定时器&#xff0c;在定时到期以后执行注册的回调函数 &#xff08;3&#xff09;uni.showToast&#xff1a;当我们需要进行弹出提示框的时候&am…

Django学习(2.2.1版本)

项目技术重难点分析&#xff1a; 模型层&#xff1a;模型是您的数据唯一而且准确的信息来源。它包含您正在储存的数据的重要字段和行为。一般来说&#xff0c;每一个模型都映射一个数据库表。 每各模型都是一个python的类&#xff0c;这些类继承 django.db.models.Model 模型类…

#前端# #小程序#如何将本地图片上传到服务器,并进行引入项目?

需求&#xff1a; 在我们进行前端开发中&#xff0c;特别是小程序的开发中&#xff0c; 因为打包的时候会有限制&#xff0c;超2m就打包不了&#xff0c; 这个时候&#xff0c;有可能是图片过多占内存&#xff0c; 那只需要将本地的图片上传到服务器&#xff0c;再把本地文…

007-cobbler+koan自动化重装系统

一、操作步骤 1.在使用cobbler自动化安装的虚拟机上做以下操作 2.安装epel源&#xff08;先配置好yum&#xff09; [rootlocalhost ~]# yum install epel-release -y2.安装koan工具 [rootlocalhost ~]# yum install koan -y3.查看可以重装的列表&#xff08;还可以装别版本的系…

#小程序#如何解决渲染层网络层错误?

使用uni-app开发小程序的一个小坑&#xff1a; 在开发过程中&#xff0c;遇到的一个报错&#xff1a; [渲染层网络层错误] Failed to load font http://172.16.0.234:8081/profile/upload/style.ttf net::ERR_CONNECTION_TIMED_OUT (env: Windows,mp,1.05.2109131; lib: 2.…

#vue# element-ui 如何修改类名

问题&#xff1a; 在使用element组件的时候&#xff0c;经常会出现样式不符合我们项目预期的情况&#xff0c;这个时候我们就可以通过修改组件的样式 步骤如下 使用组件的时候&#xff0c;F12可以找到组件的类名 在页面里面加入<style></style>&#xff08;位置…