图片点击放大

        在列表中添加插槽  <template slot-scope="scope">,获取当前点击的数据 

        在图片中添加点击事件的方法,用来弹出窗口

  <vxe-columnfield="icon"title="等级图标"><template slot-scope="scope"><el-imagestyle="width: 30px; height: 30px":src="scope.row.icon"@click="imgDialog(scope.row.icon)"></el-image></template>
</vxe-column>

        dialog放在列表的外面,保证窗口弹出不被阻挡 

        :visible.sync 用来绑定是否显示窗口,false表示不显示

        在dialog中放入需要显示的内容

<el-dialog title :visible.sync="imgDialogIsShow" width="300px" :modal="false"><el-imagestyle="width: 100%; height: 100%":src="imgSrc"></el-image></el-dialog>
                imgDialogIsShow: false, // 默认不显示弹框imgSrc: "" // 图片路径

        通过插槽获取到数据,赋值给imgSrc对象,并将imgDialogIsShow修改为true,弹出窗口。  

 //dialog_显示imgDialog(icon) {this.imgDialogIsShow = true;this.imgSrc = icon;
},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/190931.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

PyLMKit(3):基于角色扮演的应用案例

角色扮演应用案例RolePlay 0.项目信息 日期&#xff1a; 2023-12-2作者&#xff1a;小知课题: 通过设置角色模板并结合在线搜索、记忆和知识库功能&#xff0c;实现典型的对话应用功能。这个功能是大模型应用的基础功能&#xff0c;在后续其它RAG等功能中都会用到这个功能。功…

使用MD5当做文件的唯一标识,这样安全么?

使用MD5作为文件唯一标识符可靠么&#xff1f; 文章目录 使用MD5作为文件唯一标识符可靠么&#xff1f;什么是MD5&#xff1f;MD5的用途MD5作为文件唯一标识的优劣优势劣势 使用MD5作为文件唯一标识的建议其他文件标识算法结束语 什么是MD5&#xff1f; MD5&#xff08;Messag…

postman接口测试教程与实例分享

postman 的界面图 各个功能区的使用如下&#xff1a; 快捷区&#xff1a; 快捷区提供常用的操作入口&#xff0c;包括运行收藏夹的一组测试数据&#xff0c;导入别人共享的收藏夹测试数据&#xff08;Import from file, Import from folder, Import from link等&#xff09;&…

zookeeper心跳检测 (实操课程)

本系列是zookeeper相关的实操课程&#xff0c;课程测试环环相扣&#xff0c;请按照顺序阅读来学习和测试zookeeper。 阅读本文之前&#xff0c;请先阅读----​​​​​​zookeeper 单机伪集群搭建简单记录&#xff08;实操课程系列&#xff09;zookeeper 客户端常用命令简单记录…

kubernetes中YAML介绍;API资源对象Pod;Pod原理和生命周期;Pod资源限制

YAML介绍&#xff1b;API资源对象Pod&#xff1b;Pod原理和生命周期&#xff1b;Pod资源限制 1&#xff09;认识YAML 官网&#xff08;https://yaml.org/&#xff09; YAML 语言创建于 2001 年&#xff0c;比 XML 晚了三年。YAML虽然在名字上模仿了XML&#xff0c;但实质上与…

【【FPGA 之 MicroBlaze 自定义IP核 之 呼吸灯实验】】

FPGA 之 MicroBlaze 自定义IP核 之 呼吸灯实验 通过创建和封装 IP 向导的方式来自定义 IP 核&#xff0c;支持将当前工程、工程中的模块或者指定文件目录封装成 IP 核&#xff0c;当然也可以创建一个带有 AXI4 接口的 IP 核&#xff0c;用于 MicroBlaze 软核处理器和可编程逻辑…

Day59权限提升-win溢出漏洞ATSCps提权

针对Windows系统个人主流操作系统是win7/8/10等等&#xff0c;针对服务器就win2003和2008比较多&#xff0c; 明确权限提升问题&#xff0c;web和本地&#xff1a; 举个例子&#xff0c;现在获得了一个网站权限&#xff0c;这个权限只可以对网站自身的东西进行操作&#xff0…

Python字典类型

目录 目标 版本 官方文档 简介 实战 创建 循环 常用方法 目标 掌握字典类型的使用方法&#xff0c;包括&#xff1a;创建、循环、常用方法等操作。 版本 Python 3.12.0 官方文档 Mapping Types — dicthttps://docs.python.org/3/library/stdtypes.html#mapping-type…

Halcon参考手册目标检测和实例分割知识总结

1.1 目标检测原理介 目标检测&#xff1a;我们希望找到图像中的不同实例并将它们分配给某一个类别。实例可以部分重叠&#xff0c;但仍然可以区分为不同的实例。如图(1)所示&#xff0c;在输入图像中找到三个实例并将其分配给某一个类别。 图(1)目标检测示例 实例分割是目标检…

敌方移动发射[java坦克大战]

1.首先要确保判断如果敌人坦克存活并且敌人子弹集合等于0了&#xff0c;就根据坦克方向创建一颗子弹&#xff0c;放入到shots集合&#xff0c;并启动。(逻辑&#xff1a;发射子弹后&#xff0c;敌人坦克向前移动一段距离后转向&#xff0c;敌人坦克仍然存活并且刚发射的子弹消亡…

C++-设计一个特殊类

目录 一.设计一个类&#xff0c;不能被拷贝 二.设计一个类只能在堆上创建对象 三.设计一个类只能在栈上创建对象 四. 请设计一个类&#xff0c;不能被继承 五.请设计一个类&#xff0c;只能创建一个对象(单例模式) 1.单例模式&#xff1a; 2. 饿汉模式 一.设计一个类&#x…

代码浅析DLIO(四)---位姿更新

0. 简介 我们刚刚了解过DLIO的整个流程&#xff0c;我们发现相比于Point-LIO而言&#xff0c;这个方法更适合我们去学习理解&#xff0c;同时官方给出的结果来看DLIO的结果明显好于现在的主流方法&#xff0c;当然指的一提的是&#xff0c;这个DLIO是必须需要六轴IMU的&#x…

[WP] ISCTF2023 Web 部分题解

圣杯战争!!! 反序列化伪协议读取 where_is_the_flag 环境变量根目录当前目录 绕进你的心里 利用正则最大回溯绕过 easy_website or select 用双写绕过 空格用/**/绕&#xff0c;报错注入 wafr codesystem(ca\t /f*) webinclude 扫描得到index.bak备份文件打开为加密的代码 写…

1998-2021年全国各区县PM2.5平均浓度数据

1998-2021年全国各区县PM2.5平均浓度数据 1、时间&#xff1a;1998-2021年 2、指标&#xff1a;省、省代码、市、市代码、县代码、县、年份、均值、总和、最小值、最大值、标准差 3、来源&#xff1a;Washington university Atmospheric Composition Analysis Group 4、范围…

2023年第十二届数学建模国际赛小美赛C题雪崩防范求解分析

2023年第十二届数学建模国际赛小美赛 C题 雪崩防范 原题再现&#xff1a; 雪崩是极其危险的现象。现在&#xff0c;我们对雪崩是如何形成的已经有了很好的理解&#xff0c;但是我们还不能详细地预测雪崩发生的原因、时间和地点。村庄和道路可以通过各种方式防止雪崩。避免在脆…

Git Hooks实战:提交前检查修改文件中是否包含调试代码

说在前面 不知道大家有没有遇到这样一种情况&#xff0c;平时在写代码调试时有时候会使用到debugger&#xff0c;可能大部分时间在提交代码前会记得把debugger先删除&#xff0c;但可能也会存在将debugger提交上去的情况&#xff0c;那我们该怎么防止出现这种情况呢&#xff1…

css如何设置文本添加下划线

css文本添加下划线 text-decoration: underline;text-decoration相关属性参数 参数描述none默认。定义标准的文本。underline定义文本下的一条线。overline定义文本上的一条线。line-through定义穿过文本下的一条线。blink定义闪烁的文本。inherit规定应该从父元素继承 text-…

享元设计模式

package com.jmj.pattern.flyweight;public abstract class AbstractBox {//获取图形的方法public abstract String getShape();//显示图形及颜色public void diplay(String color){System.out.println("方块形状:"getShape()",颜色:"color);}}package com…

基于SpringBoot实现SSMP整合

&#x1f648;作者简介&#xff1a;练习时长两年半的Java up主 &#x1f649;个人主页&#xff1a;程序员老茶 &#x1f64a; ps:点赞&#x1f44d;是免费的&#xff0c;却可以让写博客的作者开心好久好久&#x1f60e; &#x1f4da;系列专栏&#xff1a;Java全栈&#xff0c;…

23.Python 图形化界面编程

目录 1.认识GUI和使用tkinter2.使用组件2.1 标签2.2 按钮2.3 文本框2.4 单选按钮和复选按钮2.5 菜单和消息2.6 列表框2.7 滚动条2.8 框架2.9 画布 3. 组件布局4.事件处理 1.认识GUI和使用tkinter 人机交互是从人努力适应计算机&#xff0c;到计算机不断适应人的发展过程&#…