小程序云开发——提交表单后一起上传图片

------效果如下：

image.png

步骤：
data如下：

data: {
    files: [],
    article:"",
    images_fileID:[]
  },

• 1. wx.chooseImage选择要上传的图片并得到图片的临时地址

chooseImage: function (e) {
    var that = this;
    wx.chooseImage({
      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
      success: function (res) {
        // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
        that.setData({
          files: that.data.files.concat(res.tempFilePaths)
        });
        
      }
    })
  },

• 2. wx.cloud.uploadFile上传图片后将得到的图片fileID和其他数据都传入数据库
     这里就有一个问题：wx.cloud.uploadFile上传单张图片只能得到单张图片的fileID。这就导致了success中不能直接写上传数据库的函数，而是要等图片的fileID全部得到后再存入数据。我的解决方法是加一个if判断，具体如下：

//每上传一张图片就得将图片的fileID存到data中
//当data中的 images_fileID 的长度和files的长度一样时，说明所有图片的fileID都得到了
if (images_fileID.length === imageFiles.length) {
  //上传数据库
}

具体上传整个数据的代码如下

publishArticle:function(e){
   //时间，文章内容，图片
   var that=this;
   var imageFiles=that.data.files;    
   var date=new Date();
   var now=date.getFullYear()+"/"+date.getMonth()+"/"+date.getDate()+" "+date.getHours()+":"+date.getMinutes();    //得到此时的时间
   wx.cloud.init();
   const db = wx.cloud.database();    //初始化数据库
  //for循环进行图片上传
   for (var i = 0; i < imageFiles.length; i++) {
     var imageUrl = imageFiles[i].split("/");
     var name = imageUrl[imageUrl.length - 1];        //得到图片的名称
     var images_fileID = that.data.images_fileID;    //得到data中的fileID
     wx.cloud.uploadFile({
       cloudPath: "community/article_images/" + name,    //云存储路径
       filePath: imageFiles[i],                          //文件临时路径
       success: res => {
         images_fileID.push(res.fileID);
         that.setData({
           images_fileID: images_fileID         //更新data中的 fileID
         })
         if (images_fileID.length === imageFiles.length) {
           //对数据库进行操作
           db.collection("community_articles").add({
             data: {
               time: now,
               article: e.detail.value.article,
               images: imageFiles,
               images_fileID: that.data.images_fileID
             },
             success(res) {
               console.log(res)
             },
             fail(res) {
               console.log(res)
             }
           })
         }
       }
     })
   }
 }