微信小程序调用相机和相册并在页面显示图片

代码

wxml

<button type="default" bindtap="send">diaoyong</button>//bindtap绑定事件“send",send的作用在js中定义
<image src="{{tempfilepath }}" mode="aspecFill" />

js

Page({
data: {
  tempfilepath:null
},
onLoad: function (options) {
  self=this//没有这步编译不通过，self可以改成其他变量名
},
send:function()
{
 wx.chooseImage({
   count: 1,
   sizeType: ['original', 'compressed'],
   sourceType: ['album', 'camera'],
   success (res) {
     // tempFilePath可以作为img标签的src属性显示图片
     var tempFilePaths = res.tempFilePaths
     self.setData({tempfilepath:tempFilePaths[0]})//tempFilePaths为一个数组，显示数组第一个元素
     //setData 函数用于将数据从逻辑层发送到视图层（异步），同时改变对应的 this.data 的值（同步）。
   }
 })
}
})

成果展示