使用docx-preview插件来实现word文档预览
先npm i docx-preview --save
<!-- 文件预览 -->
<el-dialog title="预览" :visible.sync="previewFile" width="50%">
<div class="fileView">
<div ref="fileView"></div>
</div>
</el-dialog>
// 处理word方法
handlePrimay(row) {
this.previewFile = true;
var raw = window.atob(row.url);
var uInt8Array = new Uint8Array(raw.length);
for (var i = 0; i < raw.length; i++) {
uInt8Array[i] = raw.charCodeAt(i);
}
const blob = new Blob([uInt8Array], {
type: "application/msword"
});
this.$nextTick(() => {
let docx = require("docx-preview");
docx.renderAsync(blob, this.$refs.fileView); // 渲染到页面
});
}
.fileView {
width: 100%;
overflow: hidden;
height: 75vh;
overflow-y: auto;
}