Micro-channel cloud development program to achieve a small community Demo (supplement)

Before writing an article describes how to use cloud development to achieve a community Demo: micro-channel small program - the development of a community cloud Demo (end -) to achieve
recognition of the many small partners but there have been some problems.

The main problems are:

• Published images do not show cross-end publishing pictures do not show
• The thumbs up function optimization
• Database is not clear
• We need to add reply function

To solve these problems, I will update the code, and address: dongxi346 / Donut , in READMEthere using the introduction, or read on.

ps: there is a point to help a friend of mine starThank you very much.

This update mainly:

• Solve the problems above arise
• Optimized code structure

Picture Problem Cause analysis
read my source friends should know that I have saved the wx.chooseImage APItemporary image link is returned, then in order to facilitate direct so did.

But now it's time temporary picture will certainly be failures, but also cross-end publishing pictures have a problem (in this release posted on the computer and cell phone pictures can only be displayed at each end)

According to the development of habit, we certainly should first pictures uploaded to the server, the server will return the picture link this image links to the database, cloud development here also provides file storage capabilities, so we only need to do three steps can solve this image problem .

The first step:
After selecting the picture, will save temporary image link

Step Two:
When you want to submit to the database server in order to upload pictures to get the picture link

The third step:
the release of the data stored in the cloud database

I For convenience, the first step directly to the two merged, the following pseudo-code:

chooseImage: function(event) {
    wx.chooseImage({
      count: 6,
      success: function(res) {
        // 设置图片
        that.setData({
          images: res.tempFilePaths,
        })
        // 这里清空一下，否则会出现图片上传重复问题
        that.data.images = []
        console.log(res.tempFilePaths)
        for (var i in res.tempFilePaths) {
          // 将图片上传至云存储空间
          wx.cloud.uploadFile({
            // 指定要上传的文件的小程序临时文件路径
            cloudPath: that.timetostr(new Date()),
            filePath: res.tempFilePaths[i],
            // 成功回调
            success: res => {
            // 获取到服务器图片链接地址
              that.data.images.push(res.fileID)
            },
          })
        }
      },
    })
  },
  /**
   * 图片路径格式化
   */
  timetostr(time){
    var randnum = Math.floor(Math.random() * (9999 - 1000)) + 1000;
    var str = randnum +"_"+ time.getMilliseconds() + ".png";
    return str;
  },

The third step is to add database operations, and direct deposit picture field that.data.imagesvalues on the line

The thumbs up function to optimize
the main reason is not clear prior to database design, thumbs should be placed in a separate database table, you should not rely on the article.

During the implementation of the source code can refer to the article details Source

The database does not clear
the main reason is just beginning to realize this Demo thought so fine, just think implement the functionality, data tables designed carefully enough. Database design piece of knowledge I was an outsider, currently my idea is to design a single table structure as much as possible.

View the project README use the introduction of

Add reply feature
community did not respond Demo function can not be justified, it is simply added, UI ugly, but basically a simple reply function

During the implementation of the source code can refer to the reply function Source

Reproduced in: https: //www.jianshu.com/p/60467f494d46