vue 预览word、excel、pdf文档 vue-office（VueOfficeDocx、VueOfficeExcel、VueOfficePdf）

在Vue中预览Word、Excel和PDF文档，可以使用以下几个库：

1. VueOfficeDocx：用于在Vue应用中嵌入Word文档预览。
2. VueOfficeExcel：用于在Vue应用中嵌入Excel表格预览。
3. VueOf：一个集成了Word和Excel预览的库。

以下是使用VueOfficeDocx和VueOfficeExcel库的简单示例：

首先，安装这些库：

npm install vue-office-docx vue-office-excel

然后，在Vue组件中使用它们：

<template>
  <div>
    <!-- Word 文档预览 -->
    <vue-office-docx src="path/to/your/word/document.docx"></vue-office-docx>
 
    <!-- Excel 表格预览 -->
    <vue-office-excel src="path/to/your/excel/spreadsheet.xlsx"></vue-office-excel>
  </div>
</template>
 
<script>
import VueOfficeDocx from 'vue-office-docx';
import VueOfficeExcel from 'vue-office-excel';
 
export default {
  components: {
    VueOfficeDocx,
    VueOfficeExcel
  }
};
</script>

请注意，src 属性应该是文件的路径，可以是本地路径或者远程URL。

对于PDF文档，可以使用Vue的常规PDF查看器组件，如<iframe>或者<embed>标签：

<template>
  <div>
    <!-- PDF 文档预览 -->
    <iframe :src="pdfUrl" width="100%" height="500px"></iframe>
  </div>
</template>
 
<script>
export default {
  data() {
    return {
      pdfUrl: 'path/to/your/pdf/document.pdf'
    };
  }
};
</script>

在这个示例中，:src是一个绑定的属性，可以动态地设置PDF文件的路径。

以上代码提供了在Vue应用中嵌入Word、Excel和PDF文档的简单方法。记得确保文件的路径是可访问的，并考虑文件的安全性和权限问题。