5.vue-word文件浏览器展示

1.下载
npm i docx-preview --save
2.引入
var docxx = require("docx-preview");
3.编写容器

<div  ref="word"
     v-loading="flieLoading"
     element-loading-text="拼命加载中"
     element-loading-background="#f4f5f7"
     element-loading-spinner="el-icon-loading" class="docWrap">
</div>

4.从后端请求到流放进容器

getData() {
      this.flieLoading = true;
      
      axios({
        url: this.baseUrl + `/${id}/downLoad`,
        method: 'post',
            data: {},
            responseType: "arraybuffer"
      }).then(res => {
        this.flieLoading = false;
        this.$nextTick(() => {
          docxx.renderAsync(res.data, this.$refs.word);
        })
      }).catch((error) => {
        this.$message.error(error);
        this.flieLoading = false;\
      });
    },
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容