【开发日记】Uniapp对指定DOM元素截长图

1、背景

使用uniapp开发的APP，需要对页面中指定的DOM（指定区域）进行长截图，长截图就是手机屏幕不足以通过一个屏幕展现完整的内容，并将截图保存到手机相册中。

2、完整实现

安装依赖

安装插件：https://ext.dcloud.net.cn/plugin?id=15050

点击以上的链接中的下载插件并导入HBuildeX按钮，将插件导入到项目中。

在项目中安装html2canvas的node包：

npm install html2canvas

页面核心代码

在页面中引入组件：

<!-- 需要截图的DOM区域 -->
<view id="render-dom" class="content-box">
  <!-- 你的页面内容 -->
</view>

<sp-html2canvas-render :useCORS="true