vue3 项目中预览 word（.docx）文档方法

• 通过 vue-office/docx 插件预览 docx 文档
• 通过 vue-office/excel 插件预览 excel 文档
• 通过 vue-office/pdf 插件预览 pdf 文档

安装插件

npm install @vue-office/docx vue-demi

示例代码

<template>
  <VueOfficeDocx :src="docx" @rendered="rendered"></VueOfficeDocx>
</template>

<script setup lang="ts">
import VueOfficeDocx from "@vue-office/docx";
import "@vue-office/docx/lib/index.css";
import { ref } from "vue";
const docx = ref("../../public/01.docx");

const rendered = () => {
  console.log("加载完毕...");
};
</script>

<style lang="scss" scoped></style>

项目目录结构截图

实际效果截图