vue导出word文档（图文示例）

在Vue中导出Word文档，可以使用html-docx-js库将HTML转换为Docx格式的文档。以下是一个简单的例子：

1. 安装html-docx-js库：

npm install html-docx-js

2. 在Vue组件中使用：

<template>
  <div>
    <button @click="exportWord">导出Word文档</button>
  </div>
</template>
 
<script>
import htmlDocx from 'html-docx-js/dist/html-docx';
 
export default {
  methods: {
    exportWord() {
      // 准备要转换的HTML内容
      const htmlContent = `
        <h1>Hello World</h1>
        <p>这是一个段落。</p>
      `;
 
      // 将HTML转换为Docx文档
      const doc = htmlDocx.asBlob(htmlContent);
 
      // 创建一个链接元素用于下载文件
      const link = document.createElement('a');
      link.href = URL.createObjectURL(doc);
      link.download = 'example.docx'; // 设置下载文件名
 
      // 触发下载
      link.click();
 
      // 清理
      URL.revokeObjectURL(link.href);
    }
  }
};
</script>

这段代码中，我们创建了一个按钮，当点击按钮时，会触发exportWord方法。该方法会生成一个包含HTML内容的Word文档，并提示用户下载。需要注意的是，生成的文档内容应该是静态的，如果需要动态数据，应该先将数据转换为HTML字符串再进行导出。