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

预览功能实现

需求:将后端返回来的文字或者图片和视频展示在页面上。

        <!-- 预览 --><el-dialog title="预览" :visible.sync="dialogPreviewVisible" width="50%" append-to-body :close-on-click-modal="false" @close="PreviewClose"><div style="margin-bottom:5%"><h1>{{previewTitle}}</h1></div><div class="content" v-html="previewContent"></div></el-dialog>// 预览事件previewButton(row){let _this = this;let isNull = validatenull;getDetails(row.id).then((res)=>{if(res.data.code == 0){_this.dialogPreviewVisible = true;console.log(res.data.data,'预览');_this.previewTitle = res.data.data.title_this.previewContent = res.data.data.contentconsole.log(res.data.data.content,'66666');}})},<style scoped lang="scss">.titleClass{display:flex;justify-content: center;}.content{/deep/ p{img{width: 100% !important;}}/deep/ .ql-video{position: static;}}</style>

http://www.lryc.cn/news/251270.html

相关文章:

  • canvas基础:绘制贝塞尔曲线
  • 高项备考葵花宝典-项目范围管理输入、输出、工具和技术
  • 在表格中显示字典的内容(根据后端返回的数据)vue3
  • 编程怎么学才能快速入门,分享一款中文编程工具快速学习编程思路,中文编程工具之边条主控菜单构件简介
  • MySQL索引下推
  • 代码随想录刷题题Day3
  • GO学习之 单例模式 sync.Once
  • 应用安全四十三:无密码认证安全
  • Lattice-Based Blind Signatures: Short, Efficient, and Round-Optimal
  • Qt/C++音视频开发57-切换音视频轨道/切换节目流/分别切换音频视频轨道
  • 深度学习之基于Django文本情感分析识别系统
  • 138. 随机链表的复制 --力扣 --JAVA
  • Python Flask 框架开发
  • k8s安装-学习环境
  • Vue3动态表单
  • 2312skia,15vulkan及技巧
  • TLSF算法概念,原理,内存碎片问题分析
  • sharding-jdbc实现分库分表
  • JDK中lock锁的机制,其底层是一种无锁的架构实现的,公平锁和非公平锁
  • c++通过serial库进行上下位机通信
  • 【傻瓜级JS-DLL-WINCC-PLC交互】7.​C#直连PLC并读取PLC数据
  • 指针常量和常量指针的区别
  • 离散化算法总结
  • 【海思SS528 | VO】MPP媒体处理软件V5.0 | VO模块编程总结
  • 逻辑卷管理器lvm
  • 函数声明后的“ - >”是什么?
  • 51爱心流水灯32灯炫酷代码
  • 将不同时间点的登录状态记录转化为不同时间段的相同登录状态SQL求解
  • 正则表达式与SQL数据库教程
  • HTML_web扩展标签