方法一：使用 html-docx-js
html-docx-js 是一個輕量級的庫，可以將 HTML 轉換為 Word 文檔。
- 安裝依賴
首先安裝 html-docx-js：
Bash深色版本
npm install html-docx-js --save
- 創建導出邏輯
在 Vue 組件中實現導出功能的代碼如下：
Vue深色版本
<template><div><button @click="exportToWord">導出為Word</button><div id="content" ref="content"><h1>這是一個標題</h1><p>這是段落內容。</p ><ul><li>列表項 1</li><li>列表項 2</li></ul></div></div>
</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>
