cnpm install html2canvas --save
先安装插件，cnpm(淘宝)比npm快，可以节省很多时间
安装cnpm教程在勤奋鸟后台搜索
安装成功后，需要的页面里引入
引入之后，所需代码
王鹤翔 //点击生成图片
toImage () {
html2canvas(this.$refs.capture,{
backgroundColor: null
}).then(canvas => {
//获取图片base64地址,如果想要展示图片即可直接展示
// let dataURL = canvas.toDataURL("image/png");
// this.imgUrl = dataURL;
//创建一个a标签，直接下载生成的图片
let link = document.createElement("a");
link.href = canvas.toDataURL();
link.setAttribute("download", "赛事分享.png");
link.style.display = "none";
document.body.appendChild(link);
link.click();
});
},直接复制即可
link.setAttribute("download", "赛事分享.png"); 这里是设置图片的名字
ref对应着js代码里 html2canvas(this.$refs.capture,{
ref所在标签里的内容是生成图片的内容
注意：页面里的内容不要跨域，，跨域图片会在生成图片中呈空白显示
0
联系我
0条评论