vue将页面导出成word

方法一：使用 html-docx-js

html-docx-js 是一个轻量级的库，可以将 HTML 转换为 Word 文档。

1. 安装依赖
   首先安装 html-docx-js：
   Bash深色版本

   npm install html-docx-js --save

2. 创建导出逻辑
   在 Vue 组件中实现导出功能的代码如下：
   Vue深色版本

   <template>
   <button @click="exportToWord">导出为Word</button>

   这是一个标题

   这是段落内容。

   • 列表项 1
   • 列表项 2
   </template> <script> import { saveAs } from 'file-saver'; import htmlDocx from 'html-docx-js/dist/html-docx';

   export default {
   methods: {
   exportToWord() {
   // 获取 HTML 内容
   const content = this.$refs.content.innerHTML;

      // 将 HTML 转换为 Word 文档
      const converted = htmlDocx.asBlob(content);
   
      // 使用 file-saver 保存文件
      saveAs(converted, 'example.docx');
    }

   }
   };
   </script>

   <style scoped> /* 样式可以根据需要自定义 */ #content { font-family: Arial, sans-serif; } </style>