uniapp从选择图片到上传图片

直接贴代码

<template>
      <view class="container">
            <view @click="chooseTheImg">上传图片</view>
      </view>
</template>

<script>
     methods:{
          //选择图片
          chooseTheImg(){
                uni.chooseImage({  
                      count: 1,  //图片可选择数量
                      sizeType: ['original','compressed'],  //original 原图，compressed 压缩图，默认二者都有
                      sourceType: ['album'],   //album 从相册选图，camera 使用相机，默认二者都有。
                      success: res => {
                            let imgFiles = res.tempFilePaths   //图片的本地文件路径列表
                            this.uploadTheImg(imgFiles)
                      }
                })
          },
          //上传图片
          uploadTheImg(imgFiles){
                uni.uploadFile({
                      url: `${this.$baseUrl}/api-upload/uploadimg`,   //后端用于处理图片并返回图片地址的接口
                      header:{
                            "Token":this.userToken
                      },
                      filePath: imgFiles[0],
                      name: 'file',
                      success: res => {
                            let data=JSON.parse(res.data)   //返回的是字符串，需要转成对象格式，打印data如下图
                            if(data.code==200){
                                  console.log(data.msg)  //图片地址
                            }
                      },
                      fail: () => {}
                })
          },
    } 
</script>