使用html2canvas导出页面某一块内容为图片保存到本地(示例)

最新推荐文章于 2024-08-22 11:32:42 发布

Amodoro

最新推荐文章于 2024-08-22 11:32:42 发布

阅读量598

点赞数 7

文章标签：前端 html2canvas html2canvas使用 html2canvas示例前端导出图片

本文链接：https://blog.csdn.net/qq_40230735/article/details/136321720

版权

本文介绍了如何在JavaScript中利用html2canvas库将HTML页面内容转换为图片，通过getElementById获取指定id的div元素，然后调用html2canvas方法生成canvas，最后将其转换为dataURL并作为下载链接供用户下载。

摘要由CSDN通过智能技术生成

import html2canvas from "html2canvas"

// <div id="content"></div>

handleExport() {
  const Dom = document.getElementById('content')
  html2canvas(Dom, {}).then(canvas => {
    const a = document.createElement('a')
    a.href = canvas.toDataURL("image/png")
    a.download = `${"导出图片的名称"}`
    a.click()
    a.remove()
  })
},