html2canvas
npm i html2canvas
<el-button type="primary" plain size="mini" @click="download" >Download</el-button>
import html2canvas from 'html2canvas'
methods: {
download() { // 图表转换成canvas html2canvas(document.getElementById('download')).then(function (canvas) { var img = canvas .toDataURL('image/png') .replace('image/png', 'image/octet-stream') // 创建a标签,实现下载 var creatIMg = document.createElement('a') creatIMg.download = '图表.png' // 设置下载的文件名, creatIMg.href = img // 下载url document.body.appendChild(creatIMg) creatIMg.click() creatIMg.remove() // 下载之后把创建的元素删除 }) },
}