vue 实现在线预览docx文件

docx-preview纯前端插件， 只能够实现docx后缀的文件，doc文件打不开。

1.npm i docx-preview

2.<div class="docWrap" >

<!-- 预览文件的地方（用于渲染） -->
<div id="bodyContainer"></div>
</div>

3.import {  renderAsync } from "docx-preview";

4.

const fetchwordUrl = async (keycode) => {
const blob = await Api.DesignInfor.ShowloadProjsImportTemplate(keycode);//请求后端API返回blob数据类型
let bodyContainer = document.getElementById("bodyContainer");
renderAsync(
blob, // Blob | ArrayBuffer | Uint8Array, 可以是 JSZip.loadAsync 支持的任何类型
bodyContainer, // HTMLElement 渲染文档内容的元素,
null, // HTMLElement, 用于呈现文档样式、数字、字体的元素。如果为 null，则将使用 bodyContainer。

).then(res => {
console.log("res---->", res)
})
}

5.去灰边

:deep(.docx-wrapper) {
background-color: #fff;//设置灰边
}