文件预览的实现

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>
相关推荐
橘色的狸花猫8 小时前
浪漫色彩下的博客系统
java·vue
千寻技术帮8 小时前
10355_基于Springboot的驾校管理系统
spring boot·mysql·vue·文档·驾校管理
十铭忘9 小时前
Vue3实现Pixso中的钢笔工具
开发语言·javascript·vue
wetyuo12 小时前
【随手记】uniapp + V3 使用TailwindCss3
uni-app·vue·css3·vite
打工人小夏13 小时前
前端面试题
前端·css·前端框架·vue·html·es6·html5
莫生灬灬14 小时前
VueMultiBrowser - 开源多浏览器管理器
运维·开发语言·chrome·c#·自动化·vue
曲幽1 天前
手把手搞定FastAPI静态文件:安全、上传与访问
css·python·fastapi·web·js·favicon·staticfiles
冥界摄政王2 天前
Cesium学习第二章 camera 相机
node.js·html·vue3·js·cesium
千寻技术帮2 天前
10356_基于Springboot的老年人管理系统
java·spring boot·后端·vue·老年人
铅笔侠_小龙虾2 天前
Emmet 常用用法指南
前端·vue