H5中Vant上传多张图片在beforeRead之后压缩手动上传

我还没睡呐

于 2024-01-22 21:49:41 发布

阅读量874

点赞数 8

分类专栏： vue H5 Vant 文章标签：前端 javascript vue.js

本文链接：https://blog.csdn.net/qq_57684473/article/details/135758798

版权

本文介绍了如何在Vue项目中利用image-conversion插件对上传的图片进行精确压缩，包括安装步骤、在before-read钩子中的使用方法以及上传附件到后端的处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

看了好多个文章总结出来的一个便捷方法。

这里也是参考了这位大佬给的灵感

利用image-conversion 插件直接对图片进行压缩。

下面是使用步骤

效果图

1.安装插件

npm i image-conversion --save

2.在页面引入

import * as imageConversion from 'image-conversion'

3.具体使用方式

1.引入组件

 <van-uploader v-model="fileList" accept="image/*"
 :before-read="beforeRead"
 @change="handleChange"
 @delete="beforeDelete"
 :max-count="6"
 :multiple="true"
 preview-size="85px"
 :after-read&

最低0.47元/天解锁文章