文件预览的实现

1.pdf预览

使用iframe

如果是预览本地文件,且是vue项目,pdf文件需要放在public文件夹下。
调试环境:vue、vant、js

html 复制代码
<template>
  <div style="height: 100%;width: 100%">
    <iframe :src="pageUrl" style="width: 100%;height: 100%"></iframe>
  </div>
</template>
<script setup>
import {ref} from "vue";
const pageUrl = ref('/xxx.pdf');
</script>
<style lang="scss" scoped>
</style>
相关推荐
John_ToDebug18 小时前
引擎深处的漫游者:构建浏览器JavaScript引擎的哲学与技艺
javascript·chrome·js
Cult Of2 天前
Alicea Wind的个人网站开发日志(2)
开发语言·python·vue
Byron07072 天前
从多端割裂到体验统一:基于 Vue 生态的跨端架构落地实战
vue·多端
计算机程序设计小李同学2 天前
基于 Spring Boot + Vue 的龙虾专营店管理系统的设计与实现
java·spring boot·后端·spring·vue
沐墨染3 天前
Vue实战:自动化研判报告组件的设计与实现
前端·javascript·信息可视化·数据分析·自动化·vue
奔跑的呱呱牛3 天前
viewer-utils 图片预览工具库
javascript·vue·react
esmap3 天前
OpenClaw与ESMAP AOA定位系统融合技术分析
前端·人工智能·计算机视觉·3d·ai·js
Cult Of3 天前
Alicea Wind的个人网站开发日志(1)
python·vue
薛定谔的猫喵喵3 天前
猪笼草生长环境模拟器:交互式生物教育工具实现指南
python·html·echarts·js
Polaris_YJH3 天前
使用Vue3+Vite+Pinia+elementUI搭建初级企业级项目
前端·javascript·elementui·vue