微信小程序选择和上传图片

一、布局文件

  <view class="zoomtopZG">

        <view class="rpname" style="font-size: 30rpx;">图片信息：</view>

        <image src="{{imagePath}}" mode="" style="width: 150rpx;height: 150rpx;margin-top: 20rpx;" bindtap="choiceImage"/>

      </view>

二、js选择图片以及图片上传服务端

  choiceImage:function(){

    var that = this;

    wx.chooseImage({

      count: 1,

      sizeType: ['original', 'compressed'],

      sourceType: ['album', 'camera'],

      success (res) {

        const tempFilePaths = res.tempFilePaths

        //上传图片

        wx.uploadFile({

          url:  appData.globalData.imageUpLoad,  //图片文件地址

          filePath: tempFilePaths[0],  //图片的本地路径信息

          name: 'file',

          success (res){

            const data = res.data

             //上传结果码判断

            if(res.statusCode==200){

              console.log("log_js_data:图片上传成功");

              that.setData({

                imagePath:tempFilePaths,

                uploadImage:tempFilePaths[0].split("/")[3]   //获取上传的图片信息用户提交保存数据库

              })

            }

          }

        })

      }

    })

  },