nvue canvas踩坑经历

总结就是：用到绘制海报类似的地方(drawImage)不要用nvue。

1. nvue 不支持普通的canvas api绘制。
2. 然后找到了gcanvas这个东西，在iOS上还行，可以用。
3. 然后到Android上一测，拉垮了。报错：exception function:gcanvas setBackGround for android view, exception:WX_REND大概原因就是gcanvas在安卓上绘制图像很容易各种问题，gcanvas是个第三方团队产品，uniapp官方在社区也曾说不推荐使用gcanvas。确实支持度不好。
4. 没办法，gcanvas不能用在安卓上，只能再看看其他办法。然后采用了nvue+webview的方案，nvue使用webview加载hybrid本地html，准备用web canvas来绘制，一通操作猛如虎，嗯，安卓上能正常了
5. 然后到iOS上一看，又拉跨了，canvas.toDataURL时报错了：the operation is insecure。翻译一下就是资源跨域问题。还奇怪呢，本地html引用的都是相对路径的本地资源，咋还会跨域，一通查一通找，发现了官方给出的解释：wkwebview环境本地资源也算跨域。好吧，没办法，那继续看看有没有办法解决吧。后面在社区里看了下发现有两种办法 1.plus.io 相关api读取为本地路径。2.本地资源转成base64。一通操作一通调试后没走通，大概原因就是1.nvue webview环境下，不能用plus api。2.本地资源转base64，大概方法也是走的原生xhr或者plus转换，但是原生xhr还有canvas.toDataURL在这种情况都是有跨域问题，plus同原因1一样，也没有支持。
6. 最后，不纠结了，掉头吧。然后页面转为vue文件渲染。然后就ok了。

nvue这个东西官方也不维护了，虽然确实性能比vue强，但真不适合用纯nvue来做项目，巨多坑。还是见仁见智吧，合适场景下vue+nvue结合使用。

nvue+vue画布绘制并导出图片的解决方案【插件】