uniapp 长按保存图片功能

再没有后端url的情况下，前端根据div生成base64位图片，然后下载到本地，具体代码如下

引入npm包

npm i html2canvas

div转换成base64

				let self =this;
				// 获取想要转换的 DOM 节点
				const dom = self.$refs['ref'].$el;
				// DOM 节点计算后宽高
				let width = self.$refs.ref.$el.offsetWidth
				let height = self.$refs.ref.$el.offsetHeight
				// 获取像素比
				// const dpr = window.devicePixelRatio || 1;
				const dpr = window.devicePixelRatio || 1;
				// 创建自定义 canvas 元素
				const canvas = document.createElement('canvas');
				// 设定 canvas 元素属性宽高为 DOM 节点宽高 * 像素比
				canvas.width = width * dpr;
				canvas.height = height * dpr;
				// 设定 canvas css宽高为 DOM 节点宽高
				canvas.style.width = `${width}px`;
				canvas.style.height = `${height}px`;
				// 获取画笔
				const context = canvas.getContext('2d');
				// 将所有绘制内容放大像素比倍,解决dpr不同图片模糊问题
				// context.scale(dpr, dpr);
				// 将自定义 canvas 作为配置项传入，开始绘制
				html2canvas(dom, {canvas}).then((canvas) => {
				    let dataUrl = canvas.toDataURL("image/png", 1.0);
				    // let parent = dom.parentNode;
					self.dataUrl=dataUrl;
					console.log(self.dataUrl)
					this.saveImage(dataUrl)
					// self.downLoad(dataUrl)
				    // parent.innerHTML = `<img src="${dataUrl}" style="width: 100%">`;
				});		

下载功能参考官网

https://uniapp.dcloud.io/api/media/image.html#saveimagetophotosalbum