Home >WeChat Applet >Mini Program Development >Detailed explanation of the example of obtaining album photos through WeChat applet
This article mainly introduces relevant information on the detailed examples of WeChat applet obtaining album photos. Friends in need can refer to the following
WeChat applet obtains album photos
Today I encountered the user avatar setting function of the WeChat applet and took notes.
First upload the gif:
Then add the code:
Small demo, the code is very simple.
1.index.wxml
#
<!--index.wxml--> <button style="margin:30rpx;" bindtap="chooseimage">获取图片</button> <image src="{{tempFilePaths }}" mode="aspecFill" style="width: 100%; height: 450rpx"/>
2.index.js
//index.js //获取应用实例 var app = getApp() Page({ data: { tempFilePaths: '' }, onLoad: function () { }, chooseimage: function () { var _this = this; wx.chooseImage({ count: 1, // 默认9 sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有 sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有 success: function (res) { // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片 _this.setData({ tempFilePaths:res.tempFilePaths }) } }) } })API Description: Note here: What is returned is the local path of the image. If you need to upload the image to the server, you need to use another API.
wx.chooseImage({ success: function(res) { var tempFilePaths = res.tempFilePaths wx.uploadFile({ url: 'http://example.weixin.qq.com/upload', //仅为示例,非真实的接口地址 filePath: tempFilePaths[0], name: 'file', formData:{ 'user': 'test' }, success: function(res){ var data = res.data //do something } }) } })Thank you for reading, I hope it can help everyone, thank you for your support of this site!
The above is the detailed content of Detailed explanation of the example of obtaining album photos through WeChat applet. For more information, please follow other related articles on the PHP Chinese website!