wx.chooseImage(OBJECT)
从本地相册选择图片或使用相机拍照。
在小程序中添加头像或者拍摄照片:
参数 | 类型 | 必填 | 说明 |
---|---|---|---|
count | Number | 否 | 最多可以选择的图片张数,默认9 |
sizeType | StringArray | 否 | original 原图,compressed 压缩图,默认二者都有 |
sourceType | StringArray | 否 | album 从相册选图,camera 使用相机,默认二者都有 |
success | Function | 是 | 成功则返回图片的本地文件路径列表 tempFilePaths |
fail | Function | 否 | 接口调用失败的回调函数 |
complete | Function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
WXML代码如下:
<view class="weui-cells">
<view class="weui-cell">
<view class="weui-cell__bd">
<view class="weui-uploader">
<view class="weui-uploader__hd">
<view class="weui-uploader__title">点击可预览选好的图片</view>
<view class="weui-uploader__info">{{imageList.length}}/{{count[countIndex]}}</view>
</view>
<view class="weui-uploader__bd">
<view class="weui-uploader__files">
<block wx:for="{{imageList}}" wx:for-item="image">
<view class="weui-uploader__file">
<image class="weui-uploader__img" src="{{image}}" data-src="{{image}}" bindtap="previewImage"></image>
</view>
</block>
</view>
<view class="weui-uploader__input-box">
<view class="weui-uploader__input" bindtap="chooseImage"></view>
</view>
</view>
</view>
</view>
</view>
</view>
JS代码如下:
chooseImage: function () {
var that = this
wx.chooseImage({
sourceType: sourceType[this.data.sourceTypeIndex],
sizeType: sizeType[this.data.sizeTypeIndex],
count: this.data.count[this.data.countIndex],
success: function (res) {
console.log(res)
that.setData({
imageList: res.tempFilePaths
})
}
})
},
previewImage: function (e) {
var current = e.target.dataset.src
wx.previewImage({
current: current,
urls: this.data.imageList
})
}