vue图片点击超链接_[div转canvas]vue+html2canvas 实现点击 指定div生成图片并下载

最近练习vue有点入迷，连续一个月上班摸鱼学vue，前端+后台+node/express生成api接口搞出了一个网站，真是学到不少东西，今天就记录一下点击按钮，指定div生成图片的功能实现方法。

效果体验：http://color.51qux.com/cai

原理是html5中的div转canvas，具体怎么转的我也不懂，插件生成的，现在流行的就是用 html2canvas.js (http://html2canvas.hertzen.com/)实现的。

废话不多说，还是开始日记步骤：

1.进入项目根目录，安装html2canva

npm install --save html2canvas

2.实例页面 引入插件

import html2canvas from "html2canvas";

3.按钮事件绑定

下载配色

4.转图片区域通过ref="imageWrapper"控制

.......