有在自定义组件中成功使用压缩图片的大佬吗?萌新很想知道https://github.com/luckyiii/study-files/blob/master/StudyFiles/source/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F--%E5%A4%9A%E5%9B%BE%E4%B8%8A%E4%BC%A0%E5%8E%8B%E7%BC%A9%E5%B8%A6%E9%A2%84%E8%A7%88%E5%88%A0%E9%99%A4.md
项目中代码跟以上链接是一样的,只不过在项目中是自定义组件,把画布调出来并没有看见图片。是因为无法在自定义组件中使用吗?
大佬,解决了吗?在自定义组件里面调用 wx.canvasToTempFilePath 没有任何作用,也不报错。你是如何解决的?
不是,和自定义组件无关,检查一下组件通信是否将值传过来了。
调试 debug 或 log 都是直接的检错方式。
因为你有将你的代码公示出来,是什么原因就只能瞎蒙了。
建议提供代码片段,或者仔细查看官方API。(前些天我也使用了canvas,微信环境是正常的)
chooseImage: function (e) {
let that = this;
if (that.data.files.length >= 4) {
util.toast("最多上传4张图片");
return
}
wx.chooseImage({
count: 4 - that.data.files.length,
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
that.setData({
files: that.data.files.concat(res.tempFilePaths),
haveImages: true,
havePImages: true
});
that.data.imagesPress = that.data.imagesPress.concat(res.tempFilePaths);
that.setData({
imagesPress: that.data.imagesPress
var that = this;
let imagePress = that.data.imagePress;
console.log(tempFilePaths)
if (index < tempFilePaths.length) {
console.log(tempFilePaths)
wx.getImageInfo({
src: tempFilePaths[index],
success: function (res) {
console.log(res.path)
//---------利用canvas压缩图片--------------
var ratio = 2;
var canvasWidth = res.width //图片原始长宽
var canvasHeight = res.height
while (canvasWidth > 400 || canvasHeight > 400) {// 保证宽高在400以内
canvasWidth = Math.trunc(res.width / ratio)
canvasHeight = Math.trunc(res.height / ratio)
ratio++;
}
that.setData({
canvasWidth: canvasWidth,
canvasHeight: canvasHeight,
})
const ctx = wx.createCanvasContext('photo_canvas');
ctx.drawImage(tempFilePaths[index], 0, 0, canvasWidth, canvasHeight);
ctx.draw(false,setTimeout( function () {
index = index + 1;//上传成功的数量,上传成功则加1
console.log(index);
wx.canvasToTempFilePath({
canvasId: 'photo_canvas',
success: function success(res) {
imagePress.push(res.tempFilePath);
console.log('res.tempFilePath')
console.log(res.tempFilePath)
that.setData({
imagePress: imagePress
})
that.getCanvasImg(index, failNum, tempFilePaths);//递归压缩
}, fail: function (e) {
failNum += 1;//失败数量,可以用来提示用户
that.getCanvasImg(index, failNum, tempFilePaths);
}
}, that);
},300));
}
})
}
},