exam/exam-06173-vue/src/views/docxPreview/index.vue

<template>
	<div id="container" style="width: 100%;height: 100vh">

	</div>
</template>
<script>
import axios from 'axios'
import { defaultOptions, renderAsync } from "docx-preview";
export default {
	mounted(){
		console.log(this.$route.query.file)
		if(this.$route.query && this.$route.query.file){
			axios.get(this.$route.query.file, {responseType: 'blob'}).then(res => {
					renderAsync(res.data, document.getElementById("container"), null, {
							className: "docx", // 默认和文档样式类的类名/前缀
							inWrapper:  true, // 启用围绕文档内容渲染包装器
							ignoreWidth:  false, // 禁止页面渲染宽度
							ignoreHeight:  false, // 禁止页面渲染高度
							ignoreFonts:  false, // 禁止字体渲染
							breakPages:  true, // 在分页符上启用分页
							ignoreLastRenderedPageBreak:  true,//禁用lastRenderedPageBreak元素的分页
							experimental:  false, //启用实验性功能（制表符停止计算）
							trimXmlDeclaration:  true, //如果为真，xml声明将在解析之前从xml文档中删除
							debug:  false, // 启用额外的日志记录
					}
				);
			})
		}
	}
}
</script>