<el-button size="mini"
type="text"
icon="el-icon-edit"
@click="handlePreviewFile(obj)"
>预览</el-button>
<el-dialog title="预览" :visible.sync="viewVisible" width="90%" height="100%" >
<iframe
:src='sourceUrl'
width=100%
height=800
frameborder='0'>
</iframe>
</el-dialog>
data() {
return {
//文件预览
viewVisible:false,
//文件类型
fileType:null,
//文件地址
sourceUrl:null,}
}
//文件预览
handlePreviewFile(e){
var xdoc_head = "https://view.xdocin.com/view?src=";
this.viewVisible = true
this.sourceUrl = xdoc_head+ encodeURIComponent(e.fileUrl);
},

效果图


posted on   张伯灵  阅读(387)  评论(0编辑  收藏  举报
编辑推荐:
· [杂谈]如何选择:Session 还是 JWT?
· 硬盘空间消失之谜:Linux 服务器存储排查与优化全过程
· JavaScript是按顺序执行的吗?聊聊JavaScript中的变量提升
· [杂谈]后台日志该怎么打印
· Pascal 架构 GPU 在 vllm下的模型推理优化
阅读排行:
· WinForm 通用权限框架,简单实用支持二次开发
· 硬盘空间消失之谜:Linux 服务器存储排查与优化全过程
· 如何为在线客服系统的 Web Api 后台主程序添加 Bootstrap 启动页面
· 面试官:DNS解析都整不明白,敢说你懂网络?我:嘤嘤嘤!
· Fleck:一个轻量级的C#开源WebSocket服务端库



点击右上角即可分享
微信分享提示