问题

一、pdf预览解决:
      用iframe src后台路径。
二、word预览 这个插件支持.docx不支持.doc
      npm i docx-preview@0.1.4
      npm i jszip
      const docx = require('docx-preview');
      window.JSZip = require('jszip');
   
    <a-modal :dialog-style="{ top: '0px' }" width="80%" title="预览文件" :visible="yulanVisible" @cancel="yulanCancel">
        <template #footer></template>
       
          <iframe  v-if="isPdf" :src="pdfSrc" frameborder="0" style="width: 100%; height: 1200px"></iframe>
          <div v-else ref="file"></div>
      </a-modal>
    
    yulan(item) {
        this.isPdf = item.fileType.includes('.pdf');
        this.yulanVisible = true;
        this.pdfSrc = '';
        if(this.isPdf) {
          this.pdfSrc = `api/dap/nat/reportfileinfo/reportFilePreview/${item.reportFileId}`;
        } else {
          axios({
            method: 'get',
            responseType: 'blob', // 设置响应文件格式
            url: `api/dap/nat/reportfileinfo/reportFilePreview/${item.reportFileId}`,
          }).then(res => {
            if(res.status == 200) {
              this.$refs.file.indexHTML = '';
              docx.renderAsync(res.data,this.$refs.file) // 渲染到页面预览
            }
        })
      }
    },
 

 

posted @ 2022-12-14 16:42  Webwhl  阅读(134)  评论(0编辑  收藏  举报