先npm install 安装这俩个插件，然后导入需要的页面中
二维码：
//第一步：引入：import Qrcode from "@xkeshi/vue-qrcode";// 第二步：注册：components: {qrcode: Qrcode //二维码的插件需要注册组件},// 第三步：使用：<template><qrcode :value="qrcodeUrl" style="width: 72px;height: 72px"></qrcode><template>Ï// 第四步：qrcodeUrl： '' // 自己定义地址
生成海报：
现在页面上写好海报的样式，然后通过this.$refs.xxx获取到节点传入html2canvas方法方法中，再赋值给img标签显示，浏览器默认图片自带保存功能
mage.crossOrigin支持跨域图片 这个一定要放在src赋值之前，否则再ios手机上图片显示不出来
import html2canvas from "html2canvas";// 调用：html2canvas(this.$refs.xxxx, {backgroundColor: null }).then(canvas => {// 转成图片，生成图片地址this.imgUrl = canvas.toDataURL("image/png");this.canvasShow = true;});
海报一般都有接口返回的网络图，因为canvas无法绘制网络图，所以要下载到本地再调用html2canvas方法
handelCanvas() {const datas = {AlbumId: this.albumIdId};this.$axios.post(this.api.xxxxx, datas).then(res => {// console.log("分享快照==>", res);this.albumsShare = res.data;var that = this;this.main(res.data.HeadImg, function(base64) {that.HeadImg = base64;});res.data.AlbumImage = res.data.AlbumImage.substring(0,res.data.AlbumImage.indexOf("?"));console.log(res.data.AlbumImage);this.main(res.data.AlbumImage, function(base64) {that.AlbumImage = base64;});});},// 将图片转base64getBase64Image(img) {var canvas = document.createElement("canvas");canvas.width = img.width;canvas.height = img.height;var ctx = canvas.getContext("2d");ctx.drawImage(img, 0, 0, img.width, img.height);var dataURL = canvas.toDataURL("image/png"); // 可选其他值 image/jpegreturn dataURL;},// 下载网络图片main(src, cb) {var image = new Image();image.crossOrigin = "*"; // 支持跨域图片 这个一定要放在src赋值之前，否则再ios手机上图片显示不出来image.src = src + "?v=" + Math.random(); // 处理缓存var that = this;image.onload = function() {var base64 = that.getBase64Image(image);cb && cb(base64);};},
