微信小程序之上传图片功能

<!--wxml-->
<view class="contain">
  <image wx:for="{
           
    {image_url}}" src="{
           
    {item}}"></image>
</view>
<button bindtap="uploadImage">点击上传图片</button>

/*wxss*/
.contain{
          
   
  display: flex;
  flex-direction: row;
  justify-content: center;
}
image{
          
   
  width: 200rpx;
  height: 200rpx;
}

//js
Page({
          
   
  data:{
          
   
    image_url:[]
  },
  uploadImage(){
          
   
    var that =this
    wx.chooseMedia({
          
   
      count: 9,
      mediaType: [image,video],
      sourceType: [album, camera],
      maxDuration: 30,
      camera: back,
      success:(res)=>{
          
   
        console.log(res.tempFiles[0].tempFilePath);
        that.setData({
          
   
          image_url:that.data.image_url.concat(res.tempFiles[0].tempFilePath)
        })
      }
    })
  }
})

效果预览：