vue，html2canvas，网页div保存为图片

handleCreateImagesBtn () {
        let that = this
        this.actionChangeScaleAlias('1')
        if (this.showScaleState !== '1') {
          ElementMsg(this, 'success', '坐席正处于缩放状态，请将显示比列设置为100%后重试')
          return false
        } 
        ElementMsg(this, 'info', '图片生成中，请稍候...')
        // 生成图片
        let _canvas = document.querySelector('.SeatManageEditSeatArea')
        console.log(_canvas)
        html2canvas(_canvas).then(canvas => {
          console.log(canvas)
          this.toDataURL = canvas.toDataURL()
          let param =  {
            id: that.meetingInfoState.id,
            meetingId: that.$route.query.meetingId,
            meetingMaxUrl: canvas.toDataURL(),
            canvasWide: parseInt(_canvas.style.width.substring(0, _canvas.style.width.length - 2)),
            canvasHigh: parseInt(_canvas.style.height.substring(0, _canvas.style.height.length - 2))
          }
          console.log(param)
          uploadImg('', param).then((res) => {
            // 请求
          })
        })
      },

 

<a :href="toDataURL" download="图片canvas.png">下载图片</a>

转自作者：

https://juejin.im/post/5c1896d7f265da612c5dd13f