微信小程序的图片操作
1.选择图片 chooseMedia
2.获取图片信息 getImageInfo
3.预览图片 previewImage
4.保存图片至手机相册 saveImageToPhotosAlbum
案例代码:
picture.wxml
<button bindtap="choose">选择图片</button>
<button bindtap="getInfo">获取图片信息</button>
<button bindtap="preview">预览图片</button>
<button bindtap="save">保存图片到相册</button>
<!-- 展示上传成功的图片 -->
<image src="{{loadSrc}}"></image>
picture.js
Page({
/**
* 页面的初始数据
*/
data: {
loadSrc:''
},
// 保存图片
save(){
var that=this;
wx.saveImageToPhotosAlbum({
filePath:that.data.loadSrc,
success(res){
console.log('save success!!!');
}
})
},
// 预览图片
preview(){
var that=this
wx.previewImage({
urls:[that.data.loadSrc],
showmenu:true
})
},
// getImageInfo
getInfo(){
var that=this;
wx.getImageInfo({
src:that.data.loadSrc,
success(res){
console.log(res,'ressuccess');
}
})
},
// 选择图片
choose(){
var that=this
wx.chooseMedia({
success(res){
that.setData({
loadSrc:res.tempFiles[0].tempFilePath
})
},
fail(res){
},
complete(res){
}
})
},
})
这样就实现了一个简单的对于图片的操作,效果如下所示:
picture.png
点击选择图片就可以在本地选择一张已存在的图片，点击获取图片信息可以拿到图片大小，图片格式等信息，点击预览图片可以放大图片，点击保存到相册，就可以把我们的图片保存到你想要存放的路径那里了.
