html导出word文件

首先安装 npm install file-saver  与  npm install html-docx-js

然后在你的导出页面中

import FileSaver from 'file-saver'
import htmlDocx from 'html-docx-js/dist/html-docx'

使用方法

downReport(){
let contentHtml = document.getElementById("exportTable").innerHTML
//exportTable为你需要导出的html节点id  或者使用ref也可
      let cssHTML =  你想要的样式，可添加字体等等，如同在html中style中一样
      let content = `
                          <!DOCTYPE html>
                          <html>
                              <head>
                                  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
                                  <style>
                                      ${cssHTML}
                                  </style>
                              </head>
                              <body>
                                  ${contentHtml}
                              </body>
                          </html>`;
      let converted = htmlDocx.asBlob(content);
      FileSaver.saveAs(converted, xxx文档' + '.docx');
}

如此以上即可，有不懂可留言。以上均为本人拙见，实操实践。如有其他更好的建议，也可一起讨论。

 
 
posted @ 2025-03-12 16:43  前端朝花夕拾  阅读(196)  评论(0)    收藏  举报