写在前面：
最近看到看到很多人在感叹时间过得很快！在回想一下，时间确实过得很快，我也不由得想起了我来上海这两年遇到的一些事情，这些事情，后续我再慢慢记录下来。这两天，我也陆陆续续做一些面试知识总结，后面也分享给小伙伴们。咱们言归正传，小程序这里学习没有断，我们继续。
云存储：
我这里主要提供3种方式，上传、显示、下载的代码片段，每一行代码有对应的说明，有问题或者说的不对的，欢迎留言，共同学习。
上传图片：
/**
* 上传图片
*/
upload: function() {
wx.chooseImage({//选择照片
count: 1,//选择照片数量
sizeType: ['original', 'compressed'],//照片的大小，original=》原图，compressed=》压缩的
sourceType: ['album', 'camera'],//照片来源，album=》来源于相册，camera=》拍照
success(res) {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFilePaths;//照片的一个虚拟路径
console.log(tempFilePaths);
wx.cloud.uploadFile({//调用上传文件函数，这些在小程序开发文档中有
cloudPath: new Date().getTime() + '.png',//照片上传到云存储的自定义名称路径
filePath: tempFilePaths[0]//取其中一张照片的虚拟路径
}).then(res2 => {//调用成功后的的箭头函数
console.log(res2)//成功后控制台打印
db.collection('image').add({//找到存储图片虚拟路径的集合（也就是数据库表），并添加数据
data: {
fileID: res2.fileID//添加虚拟路径
}
}).then(res3 => {
console.log(res3)
}).catch(err3 => {
console.error(err3)//错误日志在控制台打印
})
}).catch(err2 => {
console.error(err2)
})
},
fail(err) {
console.error(err)
}
})
},
图片显示：
data: {
images: []
},
/**
*文件显示
*/
getFile: function() {
wx.cloud.callFunction({//唤醒云函数
name: 'login'//云函数名称为“login”，项目建立之初已经存在，目的是为了确认你显示的是哪一个openID的图片，可用于信息获取
}).then(res => {
db.collection('image').where({//通过数据库查找image表中的数据
_openId: res.result._openId//查找条件是openID为当前用户的
}).get().then(res2 => {
console.log(res2)
this.setData({//把照片的data数据塞到data中，这时候需要显示在小程序页面中，以images: []来显示
images: res2.data//这是所显示的data数据
})
}).catch(err2 => {
console.error(err2)
})
}).catch(err =>{
console.error(err)
})
},
下载图片：
/**
* 下载图片
*/
downloadFiled: function(event) {//event参数表示上下文的内容
wx.cloud.downloadFile({//调用已有的下载函数，这些在小程序开发文档中有
fileID: event.target.dataset.fileid,//获取当前上下文的目标数据的文件id，可以理解为对应图片的路径
success: res => {
// get temp file path
console.log(res.tempFilePath)
wx.saveImageToPhotosAlbum({//然后调用保存图片的函数
filePath: res.tempFilePath,//对获取到的文件路径进行保存
success(res) {//成功的回调函数
wx.showToast({//调用成功后显示内容
title: '保存成功',//调用成功后会返回一个‘保存成功’的内容到界面
})
}
})
},
fail: err => {
// handle error
console.error(err)
}
})
},
网友评论