微信小程序如何上传图片

<image src="{
           
    {tempFilePaths[0]}}"></image>
<form bindsubmit="radioselect">
    <!-- <radio-group bindchange="radioselect"> -->
        <radio-group name="cat_name">
        <view wx:for="{
           
    {items}}" wx:key="item">
        <radio value = "{
           
    {item.value}}" checked="checked"></radio>
        <view>{
         
  {item.name}}</view>
        </view>
    </radio-group>
    <input class=input-radius focus="true" type = "text" confirm-type="done" value = "" name = "cats_name" bindconfirm = "up" placeholder="请输入衣服名称" />
    <button form-type="submit" plain="true">提交</button>
</form>
<button form-type="submit" bindtap="upimg" class=jia_img plain="true" size="default">上传</button>
<!-- 请重新提交表单信息 -->
<view>{
         
  {errradioselect}}</view>
<!-- 提交衣服种类信息 -->
<view>{
         
  {usercloth.cat_name}}:{
         
  {usercloth.cats_name}}</view>
<!-- 上传成功提示信息 -->
<view>{
         
  {tips}}</view>

Page({
          
   
  data: {
          
   
    tempFilePaths: [],
    tips:"",
    items: [
      {
          
   value: 无分类, name: 无分类},
      {
          
   value: 上衣, name: 上衣, checked: true},
      {
          
   value: 下装, name: 下装},
      {
          
   value: 鞋子, name: 鞋子} ],
      usercloth:"",
      errradioselect:""
  },
  //上传图片
  upimg() {
          
   
    var that = this;
    // 显示操作菜单
    wx.showActionSheet({
          
   
      itemList: [拍照, 从相册中选择],
      success(res) {
          
   
        console.log(res.tapIndex)
        if (res.tapIndex == 0) {
          
    //0是拍照
          wx.chooseImage({
          
   
            count: 1,
            sizeType: [compressed],
            sourceType: [camera],
            success: function(res) {
          
   
              //res.tempFilePaths[0] 这个是图片
              var tempFilePaths = res.tempFilePaths ;//图片
              var tips ="上传图片成功" ;
              that.setData({
          
   
                tempFilePaths: tempFilePaths,
                tips
              })
              that.up()
            },
          })
        } else if (res.tapIndex == 1) {
          
   
          wx.chooseImage({
          
   
            count: 1,
            sizeType: [compressed],
            sourceType: [album],
            success: function(res) {
          
   
              //res.tempFilePaths[0] 这个是图片
              var tempFilePaths = res.tempFilePaths //图片
              var tips ="上传图片成功" ;
              that.setData({
          
   
                tempFilePaths: tempFilePaths,
                tips
              })
              that.up()
            },
          })
        }
      }
    })
  },
  //提交衣服信息
  radioselect(e){
          
   
    const usercloth = e.detail.value;
    console.log(usercloth)
    var user_cats_name = usercloth.cats_name
    if(user_cats_name ==){
          
   
      wx: wx.showToast({
          
   
        title: 请重新提交,
        icon:"error",
        success:res =>{
          
   
          var res = "请填写完整信息";
          this.setData({
          
   
            errradioselect:res
          })
        }
      })
    }else{
          
   
        this.setData({
          
   
          usercloth:usercloth
        })
        wx: wx.showToast({
          
   
          title: 请上传图片
        })
        wx.request({
          
   
          url: , //提交衣服种类路径
          method:GET,
          data:{
          
   usercloth:e.detail.value},
          header: {
          
   
            content-type: application/json // 默认值
          },
          success (res) {
          
   
            // console.log(res.data)
          }
        })}
  },
  //提交数据
  up() {
          
   
    console.log("this",this.data)
    var usercloth = this.data.usercloth
    // console.log(usercloth)
    var openid = wx.getStorageSync(openid)
    // console.log(openid)
    var tempFilePaths = this.data.tempFilePaths;
    // console.log("tempFilePaths"+tempFilePaths)
    wx.getFileSystemManager().readFile({
          
   
      filePath:tempFilePaths[0],
      encoding:base64,
      success:res =>{
          
   
        // console.log(data:image/png;base64, + res.data)
        // console.log(res.data)
        var tempFilePathss = data:image/png;base64, + res.data
        // var tempFilePathss = res.data
        // console.log("tempFilePathss",tempFilePathss)
        var img_data = tempFilePathss
        // const add = [];
        // add.img_data = img_data;
        // add.usercloth = usercloth
        usercloth.img_data= img_data
        usercloth.openid = openid
        console.log(usercloth)
        // console.log("img_data",img_data)
        wx.request({
          
   
          url: https://qc3752.api.cloudendpoint.cn/addimg, //添加衣服页面路径
          data:usercloth,
          method:post,
          success: function(res) {
          
   
            console.log(res)
          },
          // fail(res) {
          
   
          //   console.log(res)
          // }
        })
      }
    })
  }
})

/* pages/add/add.wxss */
button{
          
   
    margin-top: 50rpx;
}
image{
          
   
    border:#FBD2D6 solid 2.0rpx;
    margin-left: 50rpx;
    margin-top: 50rpx;
}
radio-group{
          
   
    margin-left: 60rpx;
    display:flex;
    text-align: center;
}
radio{
          
   
    width:100rpx;
}
.input-radius{
          
   
    border-radius: 30rpx;
    margin: 10rpx 0 50rpx 30rpx;
    width: 450rpx;
    background-color: #FBD2D6;
    height:70rpx;
  }