当前位置: 首页 > news >正文

js 新学一招,点击出现弹框,点击其他地方关闭弹框

文章目录

    • 需求
    • 分析

需求

鼠标点击菜单,出现二级菜单,当点击其他地方时,二级菜单自动关闭

分析

<template><el-popoverv-model="visible"></el-popover>
</template>
<script>
export default {data() {return {visible: false,hoverIndex:null,//二级菜单序号};},mounted() {window.addEventListener('click', this.handleClickAway, false);},destroyed() {window.removeEventListener('click', this.handleClickAway, true);},methods: {handleClickAway(e) {this.closePopover()},closePopover() {this.visible = false;},}
}
</script>

相关文章:

js 新学一招,点击出现弹框,点击其他地方关闭弹框

文章目录 需求分析 需求 鼠标点击菜单&#xff0c;出现二级菜单&#xff0c;当点击其他地方时&#xff0c;二级菜单自动关闭 分析 <template><el-popoverv-model"visible"></el-popover> </template> <script> export default {dat…...

c#扩展包-Stateless

准备 Stateless是一个有限状态机扩展包。在c#项目中可以直接通过NuGet安装。 使用他需要先用枚举写好你所有可能的状态和子状态。 例如移动&#xff0c;下蹲&#xff0c;空闲&#xff0c;跳跃&#xff0c;游泳&#xff0c;奔跑&#xff0c;走路。 其中&#xff0c;奔跑和走路…...

Lua函数

--函数--无参无返回值 function F1()print("F1函数") end F1() print("*****************")--有参 function F2(a)print("F2函数"..a) end F2(2) --如果传入参数和函数数量不一致 --不会报错只是补空 F2(1,2) print("*****************&quo…...

左对齐和右对齐

%d默认为左对齐&#xff0c;%5d为左对齐&#xff08;以空格补齐&#xff09;&#xff0c;%05d为左对齐&#xff08;以0补齐&#xff09;&#xff0c;%-5d右补齐&#xff08;以空格补齐&#xff09;&#xff0c;整数和小数同理。%.xf,x为小数点后保留的位数。 #include<stdi…...

高仿互站网站源码 后台手机端两套模板 电脑端二十套模版

高仿互站网 后台手机端两套模板 电脑端二十套模版&#xff0c;简单介绍几个功能&#xff0c; 支持用户注册开店 开店申请&#xff0c;支持用户发布自己商品 支持卡密形式或实物形式&#xff0c; 支持用户自己发布求助 任务大厅功能&#xff0c;源码完整 更多功能自己去发现吧…...

Spring Controller内存马

获取当前上下文运行环境 getCurrentWebApplicationContext WebApplicationContext context ContextLoader.getCurrentWebApplicationContext(); 在SpringMVC环境下获取到的是一个XmlWebApplicationContext类型的Root WebApplicationContext&#xff1a; 在Spring MVC环境中…...

Mysql004:用户管理

前言&#xff1a;本章节讲解的是mysql中的用户管理&#xff0c;包括&#xff08;管理数据用户&#xff09;、&#xff08;控制数据库的访问权限&#xff09;。 目录 1. 查询用户 2. 创建用户 3. 修改用户密码 4. 删除用户 5. 权限控制 1. 查询用户 在mysql数据库中&#xff0…...

计算机视觉与深度学习 | 视觉里程计(Visual Odometry,VO)研究现状

===================================================== github:https://github.com/MichaelBeechan CSDN:https://blog.csdn.net/u011344545 ===================================================== 视觉里程计(Visual Odometry,VO) 研究背景及意义视觉里程计国内外研…...

Mojo:新型AI语言中的7个令人惊叹的Python升级,用简单的英语解释人工智能

Mojo&#xff1a;新型AI语言中的7个令人惊叹的Python升级 编程之美 用简单的英语解释人工智能 编程之美 由Coding Beauty设计的图像&#xff0c;使用Mojo标志和Python标志。 它比C更快&#xff0c;与Python一样简单&#xff0c;但速度提高了35000倍。 进入Mojo&#xff1a;一种…...

TCP连接的三次握手与四次挥手【重点】

TCP的运输连接管理概述 TCP是面向连接的协议&#xff0c;它基于运输连接来传送TCP报文段 TCP运输连接的建立和释放是每一次面向连接的通信中必不可少的过程 TCP运输连接有以下三个阶段 TCP的运输连接管理就是使运输连接的建立和释放都能正常的进行 TCP建立连接的三次握手&a…...

​重生奇迹MU新手玩家如何快速熟悉游戏​

新手玩家必须掌握什么呢&#xff0c;建议新手玩家去官方网站上面看看游戏的详细介绍&#xff0c;必须要好的熟悉游戏的各种玩法&#xff0c;让玩家可以有一个初步的认识。 所以这方面是非常重要的&#xff0c;建议每位重生奇迹MU玩家都应该注重这些东西。下面我们就来简单介绍…...

MySQL 用户权限和远程访问设置

目录 一、用户操作查看当前拥有用户创建用户修改用户密码删除用户给root用户开放外网访问 二、用户权限操作授予权限的原则查看授予用户的权限给用户添加权限回收权限 一、用户操作 先要使用root用户登录MySQL后在执行后面操作 查看当前拥有用户 SELECT host,user,Grant_pri…...

Golang基础之关键字

Type 参考 ## https://blog.csdn.net/SHELLCODE_8BIT/article/details/122837699 type有如下几种用法&#xff1a; 定义结构体定义接口类型定义类型别名类型查询 类型定义 type Celsius float64 // 摄氏温度 type Fahrenheit float64 // 华氏温度const (AbsoluteZeroC Cels…...

DataFrame插入多列PerformanceWarning: DataFrame is highly fragmented.

DataFrame插入多列PerformanceWarning: DataFrame is highly fragmented. dataframe列比较多&#xff0c;增加列的代码如下&#xff1a; dfpd.DataFrame() for i in range(1000):vlist[]for j in range(1000):vlist.append(j) df[COL_ str(i)] vlistdf警告错误&#x…...

Springboot登录验证的统一拦截处理

在进行Springboot项目开发的时候如何把每次请求都要验证的用户进行提取拦截统一处理 背景 如果不进行统一的拦截处理&#xff0c;其实这是一个非常痛苦的一件事情&#xff0c;因为每次用户请求你都要去进行用户的信息&#xff08;用户信息存储在session中&#xff09;的验证&…...

自定义类型详解(上)

结构体 1 结构体的声明 1.1 结构的基础知识 结构是一些值的集合&#xff0c;这些值称为成员变量。结构的每个成员可以是不同类型的变量。 1.2 结构的声明 struct tag//struct是结构体的标志&#xff0c;tag是标签;名字。 {member-list;//成员变量 }variable-list;//变量列…...

【数据库——MySQL】(9)函数、查询练习及讲解

目录 1. 题目1.1 函数练习1.2 数据库查询 2. 解答2.1 函数练习2.2 数据库查询 1. 题目 1.1 函数练习 求圆周率的值&#xff0c;保留 6 位小数。生成两个 100 到 200 间的随机数。将”武汉大学”,”数学学院”,”计算数学”连接成一个字符串。求字符串中第三个字符为 A 的所有…...

【数据结构与算法——C语言】“串操作与算法”之“找出最长串及其长度”

目录 1. 实验内容及上机实验所用平台1.1 实验内容1.2 实验平台软件 2. 流程图3. 源代码4. 用例测试5. 实验总结 1. 实验内容及上机实验所用平台 1.1 实验内容 【问题描述】 给定两个字符串 s1 和 s2&#xff0c;求最长的 s1 前缀 ss 使得 ss 为 s2 的最长后缀&#xff0c;输出…...

泡泡玛特:一家中国潮玩品牌的出海之旅

泡泡玛特的出海之旅&#xff0c;可以为中国出海企业提供怎样的启示和借鉴&#xff1f; 中国潮玩品牌的出海之旅 如果在年轻人群体中聊起泡泡玛特&#xff0c;那么估计无人不知无人不晓。这家成立于2010年的潮玩企业&#xff0c;凭借琳琅满目让消费者爱不释手的创新产品&#xf…...

淘宝商品sku信息抓取接口api

在电商行业中&#xff0c;SKU是一个经常被使用的术语&#xff0c;但是对于很多人来说&#xff0c;这个词可能还比较陌生。在这篇文章中&#xff0c;我们将详细解释什么是SKU&#xff0c;以及在电商业务中它的作用和意义。 什么是SKU&#xff1f; SKU是“Stock Keeping Unit”…...

Chapter03-Authentication vulnerabilities

文章目录 1. 身份验证简介1.1 What is authentication1.2 difference between authentication and authorization1.3 身份验证机制失效的原因1.4 身份验证机制失效的影响 2. 基于登录功能的漏洞2.1 密码爆破2.2 用户名枚举2.3 有缺陷的暴力破解防护2.3.1 如果用户登录尝试失败次…...

Lombok 的 @Data 注解失效,未生成 getter/setter 方法引发的HTTP 406 错误

HTTP 状态码 406 (Not Acceptable) 和 500 (Internal Server Error) 是两类完全不同的错误&#xff0c;它们的含义、原因和解决方法都有显著区别。以下是详细对比&#xff1a; 1. HTTP 406 (Not Acceptable) 含义&#xff1a; 客户端请求的内容类型与服务器支持的内容类型不匹…...

VB.net复制Ntag213卡写入UID

本示例使用的发卡器&#xff1a;https://item.taobao.com/item.htm?ftt&id615391857885 一、读取旧Ntag卡的UID和数据 Private Sub Button15_Click(sender As Object, e As EventArgs) Handles Button15.Click轻松读卡技术支持:网站:Dim i, j As IntegerDim cardidhex, …...

【Linux】C语言执行shell指令

在C语言中执行Shell指令 在C语言中&#xff0c;有几种方法可以执行Shell指令&#xff1a; 1. 使用system()函数 这是最简单的方法&#xff0c;包含在stdlib.h头文件中&#xff1a; #include <stdlib.h>int main() {system("ls -l"); // 执行ls -l命令retu…...

MMaDA: Multimodal Large Diffusion Language Models

CODE &#xff1a; https://github.com/Gen-Verse/MMaDA Abstract 我们介绍了一种新型的多模态扩散基础模型MMaDA&#xff0c;它被设计用于在文本推理、多模态理解和文本到图像生成等不同领域实现卓越的性能。该方法的特点是三个关键创新:(i) MMaDA采用统一的扩散架构&#xf…...

将对透视变换后的图像使用Otsu进行阈值化,来分离黑色和白色像素。这句话中的Otsu是什么意思?

Otsu 是一种自动阈值化方法&#xff0c;用于将图像分割为前景和背景。它通过最小化图像的类内方差或等价地最大化类间方差来选择最佳阈值。这种方法特别适用于图像的二值化处理&#xff0c;能够自动确定一个阈值&#xff0c;将图像中的像素分为黑色和白色两类。 Otsu 方法的原…...

EtherNet/IP转DeviceNet协议网关详解

一&#xff0c;设备主要功能 疆鸿智能JH-DVN-EIP本产品是自主研发的一款EtherNet/IP从站功能的通讯网关。该产品主要功能是连接DeviceNet总线和EtherNet/IP网络&#xff0c;本网关连接到EtherNet/IP总线中做为从站使用&#xff0c;连接到DeviceNet总线中做为从站使用。 在自动…...

多模态大语言模型arxiv论文略读(108)

CROME: Cross-Modal Adapters for Efficient Multimodal LLM ➡️ 论文标题&#xff1a;CROME: Cross-Modal Adapters for Efficient Multimodal LLM ➡️ 论文作者&#xff1a;Sayna Ebrahimi, Sercan O. Arik, Tejas Nama, Tomas Pfister ➡️ 研究机构: Google Cloud AI Re…...

华为云Flexus+DeepSeek征文|DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建

华为云FlexusDeepSeek征文&#xff5c;DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建 前言 如今大模型其性能出色&#xff0c;华为云 ModelArts Studio_MaaS大模型即服务平台华为云内置了大模型&#xff0c;能助力我们轻松驾驭 DeepSeek-V3/R1&#xff0c;本文中将分享如何…...

全面解析各类VPN技术:GRE、IPsec、L2TP、SSL与MPLS VPN对比

目录 引言 VPN技术概述 GRE VPN 3.1 GRE封装结构 3.2 GRE的应用场景 GRE over IPsec 4.1 GRE over IPsec封装结构 4.2 为什么使用GRE over IPsec&#xff1f; IPsec VPN 5.1 IPsec传输模式&#xff08;Transport Mode&#xff09; 5.2 IPsec隧道模式&#xff08;Tunne…...