小程序
小游戏
企业微信
微信支付
扫描小程序码分享
刚开始使用腾讯云,我想问下在微搭低代码模块,我该怎么设计图片上传组件将图片压缩后再上传?在哪里编辑JS代码?
1 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
如果你是用的表单容器,你上传的时候已经上传到云存储里了,如果要自己实现,可以放一个上传的图标,定义一个自定义方法,贴入如下代码
export default function ({ event, data }) {
// 选择图片
wx.chooseImage({
success: function (res) {
// 获取选中的图片文件路径
var filePath = res.tempFilePaths[0];
console.log("filePath", filePath)
// 读取图片文件
// 压缩图片
wx.compressImage({
src: filePath, // 原图片数据
quality: 80, // 压缩质量
// 获取压缩后的图片文件路径
var filePath = res.tempFilePath;
console.log("filePath1", filePath)
// 上传图片到服务器
wx.cloud
.uploadFile({
cloudPath: "example.png", // 上传至云端的路径
filePath: filePath // 小程序临时文件路径,需结合小程序相关 API 获取
})
.then((res) => {
// 返回文件 ID
console.log(res.fileID);
});
}
但这种方案只是单张,而且只可以压缩jpg,限制比较多
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
如果你是用的表单容器,你上传的时候已经上传到云存储里了,如果要自己实现,可以放一个上传的图标,定义一个自定义方法,贴入如下代码
export default function ({ event, data }) {
// 选择图片
// 选择图片
wx.chooseImage({
success: function (res) {
// 获取选中的图片文件路径
var filePath = res.tempFilePaths[0];
console.log("filePath", filePath)
// 读取图片文件
// 压缩图片
wx.compressImage({
src: filePath, // 原图片数据
quality: 80, // 压缩质量
success: function (res) {
// 获取压缩后的图片文件路径
var filePath = res.tempFilePath;
console.log("filePath1", filePath)
// 上传图片到服务器
wx.cloud
.uploadFile({
cloudPath: "example.png", // 上传至云端的路径
filePath: filePath // 小程序临时文件路径,需结合小程序相关 API 获取
})
.then((res) => {
// 返回文件 ID
console.log(res.fileID);
});
}
});
}
});
}
但这种方案只是单张,而且只可以压缩jpg,限制比较多