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预览组件

相关推荐
梦梦代码精2 小时前
2026年PHP开源商城系统实测对比:架构、多商户、商用授权,谁才是真·省心?
vue.js·docker·架构·开源·代码规范
拉拉肥_King6 小时前
Vue 3 主题切换深度解析:从炫酷动画到零闪烁方案
前端·vue.js
杨梦馨7 小时前
万级数据表格卡死?Web Worker 一招搞定
前端·javascript·vue.js
DS随心转插件10 小时前
AI导出鸭:DeepSeek 转 Word 效果实测与案例展示
人工智能·ai·word·豆包·deepseek·ai导出鸭
哈撒Ki10 小时前
快速入门vue3与常见面试题
前端·vue.js·面试
云水一下11 小时前
Vue.js从零到精通系列(一):初识Vue——背景、环境与第一个应用
前端·javascript·vue.js
云水一下11 小时前
Vue.js从零到精通系列(二):响应式核心——ref、reactive、computed与watch
前端·javascript·vue.js
卤蛋fg612 小时前
vxe-table 列拖拽排序与行拖拽排序:让表格布局任意排序
vue.js
粉末的沉淀12 小时前
vue:Vite项目中高效管理纯色SVG图标的方案
前端·javascript·vue.js
卤蛋fg612 小时前
vxe-table 列宽与行高拖拽调整:让表格布局极其灵活,拖拽功能非常强大
vue.js