vue 在线预览word

1 mammoth

先找的是mammoth这个插件yarn add mammoth,版本是1,7.0

参考网上的示例使用如下:

ts 复制代码
import mammoth from "mammoth";
const vHtml = ref("")
const readExcelFromRemoteFile = (url) =>{
    var xhr = new XMLHttpRequest();
    xhr.open("get", url, true);
    xhr.responseType = "arraybuffer";
    xhr.onload = function () {
    if (xhr.status == 200) {
        mammoth.convertToHtml({ arrayBuffer: new Uint8Array(xhr.response) })
        .then(function (resultObject) {
            nextTick(() => {
            // document.querySelector("#wordView").innerHTML =
            //   resultObject.value;
            vHtml.value = resultObject.value;
            });
        });
    }
    };
    xhr.send();
}

在word中设置的样式是

因为这个图片是做了文字环绕,因此他识别不了.

在网页端显示的如下面:

待补充其他的在线word预览组件

相关推荐
Howrun7778 小时前
VSCode烦人的远程交互UI讲解
ide·vue.js·vscode
小迷糊的学习记录11 小时前
Vuex 与 pinia
前端·javascript·vue.js
利刃大大11 小时前
【Vue】Element-Plus快速入门 && Form && Card && Table && Tree && Dialog && Menu
前端·javascript·vue.js·element-plus
小毛驴85012 小时前
Vue 路由示例
前端·javascript·vue.js
TT哇15 小时前
【实习 】银行经理端两个核心功能的开发与修复(银行经理绑定逻辑修复和线下领取扫码功能开发)
java·vue.js
星光不问赶路人16 小时前
vue3使用jsx语法详解
前端·vue.js
weixin79893765432...17 小时前
Vue 组件的更新过程(编译系统 + 响应式系统 + 虚拟 DOM & Diff)
vue.js
我是伪码农18 小时前
Vue 智慧商城项目
前端·javascript·vue.js
小书包酱18 小时前
在 VS Code中,vue2-vuex 使用终于有体验感增强的插件了。
vue.js·vuex
Zhencode19 小时前
Vue3 响应式依赖收集与更新之effect
前端·vue.js