更新记录

1.1.5（2023-06-18） 下载此版本

1、修复图片获取异常处理 2、组件重复ID问题处理，满足二次封装要求

1.1.4（2023-05-17） 下载此版本

1. 【删除】batchCompress 方法

2. 【修改】部分平台会提示 uni.upx2px 的错误

1.1.3（2020-10-31） 下载此版本

1、【优化】插件代码；

2、【完善】示例功能增加图片点击预览；

平台兼容性

uni-app

其他

图片压缩

关于App平台的图片压缩问题，uniapp已经有相关的API，具体效果不清楚（没用过），与本插件比较少了H5平台的支持。文档地址：https://uniapp.dcloud.net.cn/api/media/image?id=compressimage

在 script 中引用组件

复制代码import helangCompress from '../../components/helang-compress/helang-compress';

export default {
    components: {
        helangCompress
    }
}

在 template 中添加组件

复制代码<helang-compress ref="helangCompress"></helang-compress>

方法说明：

compress() 方法参数：

为使插件在 H5 平台统一返回 base64 数据，则故意取消 H5 平台对 minSize 的设置。H5平台压缩后的图片路径是 base64 格式，有跨平台需求须注意

progress 方法回调对象属性详细说明：

源码示例：

复制代码// 示例代码较多，请大家下载 【示例项目ZIP】进行阅读

// 单张压缩
this.$refs.helangCompress.compress({
    src:this.paths[0],
    maxSize:800,
    fileType:'jpg',
    quality:0.85,
    minSize:640 //最小压缩尺寸，图片尺寸小于该时值不压缩，非H5平台有效。若需要忽略该设置，可设置为一个极小的值，比如负数。
}).then((res)=>{
    // 压缩成功回调
}).catch((err)=>{
    // 压缩失败回调
})

// 批量压缩
this.$refs.helangCompress.compress({
    src:this.paths,
    maxSize:800,
    fileType:'jpg',
    quality:0.85,
    progress:(res)=>{
        console.log('压缩进度');
        console.log(res);
    }
}).then((res)=>{
    // 压缩成功回调
}).catch((err)=>{
    // 压缩成功回调
})

友情提示：

1. 当前项目源码使用了 ES6 和 scss 请添加运行依赖
2. [插件ZIP]只包含模板文件和数据文件，不包含项目运行依赖（如 pages.json）
3. [示例项目ZIP]是完整的项目文件，可下载后导入 HBuilderX 中直接运行体验
4. 文件下载在当前页面的上部靠右位置，有 [下载插件ZIP] [下载示例项目ZIP] 按钮，点击即可下载