uniapp 开发app使用renderjs操作dom

需求:把页面中的对话内容另存为一张图片保存到手机相册。
解决方案:这时我们需要使用到document对象创建一个dom对象计算对话内容的宽高、位置等,再利用canvas能力将内容绘制绘制成一张图保存。
现状:总所周知,非H5端,不能使用浏览器自带对象,比如document、window、localstorage、cookie等,更不能使用jquery等依赖这些浏览器对象的框架。
uniapp解决方案:uniapp文档提示到App端若要使用操作window、document的库,需要通过renderjs来实现。

首先uniapp是不支持vue3的setup语法糖的,所以获取到图片后保存到相册逻辑需要这样写:


视图层中的保存按钮:


renderjs生成图片:


此致,就完成了所有的功能了。

你可能感兴趣的:(uni-app,前端)