Vue中实现HTML到HTMLDocx的转换：一种简单而高效的文档生成方式

npm install htmldocx

import HTMLDocx from 'htmldocx';

export default {
  data() {
    return {
      html: '<h1>Hello World</h1><p>This is a HTML to HTMLDocx conversion example</p>
                    <div class="aritcle_card">
                        <a class="aritcle_card_img" href="/ai/1533">
                            <img src="https://img.php.cn/upload/ai_manual/000/969/633/68b7a256cf84b637.png" alt="Browse AI">
                        </a>
                        <div class="aritcle_card_info">
                            <a href="/ai/1533">Browse AI</a>
                            <p>AI驱动的网页内容抓取和数据采集工具</p>
                            <div class="">
                                <img src="/static/images/card_xiazai.png" alt="Browse AI">
                                <span>105</span>
                            </div>
                        </div>
                        <a href="/ai/1533" class="aritcle_card_btn">
                            <span>查看详情</span>
                            <img src="/static/images/cardxiayige-3.png" alt="Browse AI">
                        </a>
                    </div>
                '
    };
  }
}

convertToDocx() {
  const docx = HTMLDocx.asBlob(this.html);
  const a = document.createElement('a');
  a.download = 'document.docx';
  a.href = window.URL.createObjectURL(docx);
  a.click();
  window.URL.revokeObjectURL(a.href);
}

<template>
  <div>
    <button @click="convertToDocx">Convert to docx</button>
  </div>
</template>