<template>
  <div>
    <el-button @click="downLoad">点击下载word文件</el-button>
    <div class="docWrap">
      <!-- 预览文件的地方（用于渲染） -->
      <div ref="file"></div>
    </div>
  </div>
</template>

<script>
import { renderAsync } from 'docx-preview';
import Api from '~/service/Api';
import commonProcess from '~/mixin/commonProcess';
export default {
  data() {
    return {
      model: { docXML: '' },
      pdf: '',
    };
  },
  mixins: [commonProcess],
  mounted() {
    this.goPreview ()
  },
  methods: {
    async goPreview () {
      let params = window.opener["params"];
      let blob = params.blob
      renderAsync(blob, this.$refs.file)
      this.$nextTick(() => {
        let dom = document.querySelector('.docWrap')
        dom.style.height = '100vh'
        dom.style.overflow = 'auto'
      })
    },
    async downLoad () {
      let params = window.opener["params"];
      let blob = params.blob
      let docnam = params.docnam
      var a = document.createElement("a"); //创建一个<a></a>标签
      a.href = URL.createObjectURL(blob); // 将流文件写入a标签的href属性值
      a.download = docnam; //设置文件名
      a.style.display = "none"; // 障眼法藏起来a标签
      document.body.appendChild(a); // 将a标签追加到文档对象中
      a.click(); // 模拟点击了a标签，会触发a标签的href的读取，浏览器就会自动下载了
      a.remove(); // 一次性的，用完就删除a标签
    }
  }
};
</script>
<style scoped></style>