一次活动开发，从头到尾踩坑无数，从兴致勃勃到嘴里骂骂咧咧，心累。不想让自己精力白费，记录一下，当成后续的积累。PS：使用VUE开发
1. 保存图片
用过购物APP的肯定见过保存图片的操作。基本都是将活动内容+个人信息生成一个图片，然后分享给用户。例如：
1. 生成二维码
其中二维码一般是一个带个人信息的链接自动生成。使用第三方插件[qrcode.vue](https://www.npmjs.com/package/qrcode.vue)。
该插件需要注意的事项：
-- size属性是number类型，不能使用诸如"vm/vh"的度量单位，因为IOS不兼容！！
2. 拼接图片（将DOM拼接成一张图）
使用html2canvas插件， 将DOM生成Canvas。
该插件的注意事项：
-- 为了保证图片的清晰程度，不要使用背景图片，使用前景图片！！
3. 将canvas转为blob
使用canvas.toBlob 方法将canvas转为二进制
4. 将图片内容上传服务器
由于封装的jsBridge需要使用远程地址进行图片下载或者分享。
2. 分享图片
分享图片的前提是1中的生成图片。然后通过内部封装的jsBridge将图片分享到微信等其他工具内。我这次是只分享到微信！
bug:分享的图片带有黑/白色的背景色
图片是非规则图片，非规则边界是UI使用的透明背景。例如：
原因： 微信对png分享到朋友圈的图片ios下是白色填充，android下是黑色填充。
解决方案：
自己设置背景色，如统一设置成为白色。
html2Canvas的方法可以自定义设置生成图片的背景色。
3. 动画播放
使用svga进行动画播放。
播放插件使用svga-player
注意⚠️：该动画方式和lottie一样，都可以暂停到某一帧。我因为不知道，走了很多弯路。
4. 查看更多
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
overflow: hidden;
一直使用该方法进行类似问题处理。但是不知道是否是webview的问题，这次开发中IOS使用该方法无效。
最后为了兼容和赶时间，使用了固定高度！！
