我用七天時間開發了一款小程序

時間 2019-11-09

標籤七天 7天時間開發一款程序简体版

原文原文鏈接

上週沒啥事就想給本身找點事作，因而跑到貼吧發了個帖子，大概意思就是免費幫別人作一個小程序，只要需求新穎就行。而後有兩三我的聯繫，最後定下了幫其中一我的作。html

此次真的是徹底從0開始，需求很簡單，只有文字描述。（爲了避免暴露太多就不放圖了）小程序

大概從上週四晚上着手構思，排版、UI都是本身琢磨着作的，因此樣式很通常（如今是真體會到了UI的重要性）。今天上午最後整理完，終於發佈到線上了。如今就記錄下這次小程序開發中的一些功能吧，若是有更好的實現方法也歡迎告知。（服務端用的是雲開發，全部功能都是基於此實現）數組

判斷是否登陸

在個人頁面或者其餘隱私頁面都會判斷用戶是否登陸，除了openid之外就是要判斷頭像、暱稱是否獲取到。緩存

我沒有把暱稱和頭像存到緩存中，我考慮到若是放到緩存中，用戶修改頭像暱稱後再進入，那兩者顯示的仍是以前的，沒法更新。因此我判斷登陸與否是根據 res.authSetting['scope.userInfo'] 是否受權過決定的。bash

judgeIsAuth(fn,par='') {
    const that = this;
    wx.getSetting({
      success: res => {
        if (res.authSetting['scope.userInfo']) {
          wx.getUserInfo({
            success: res => {
              if(fn) {
                fn(par)
              }
            }
          })
        } else {
          //此處跳登陸頁面
          return false;
        }
      }
    })
  }
複製代碼

圖片上傳

圖片不超過3張，上傳一張，按鈕對應的數量就減小一張，當上傳3張時，上傳按鈕隱藏
圖片也能夠刪除
上傳的圖片不能超過2M

//上傳圖片
uploadImg() {
    const that = this;
    const curImgList = this.data.uploadImgList; //展現圖片的數組
    if (curImgList.length >= 3) {
      return false;
    }
    // 選擇圖片
    wx.chooseImage({
      count: 1,
      sizeType: ['compressed'],
      sourceType: ['album', 'camera'],
      success: function(res) {
        wx.showLoading({
          title: '上傳中',
        })
        
        const tempFilesSize = res.tempFiles[0].size;
        if (tempFilesSize > 2000000) {
          app.info('上傳圖片不能超過2M')
          return false;
        }
        
        const filePath = res.tempFilePaths[0]
        //上傳的圖片保存到雲存儲的路徑。原本名字想按上傳的圖片名字設置，結果沒實現，只能先按時間戳設了
        const cloudPath = 'task/task' + Date.now() + filePath.match(/\.[^.]+?$/)[0] 
        wx.cloud.uploadFile({
          cloudPath,
          filePath,
          success: res => {
            curImgList.push(res.fileID)
            that.setData({
              uploadImgList: curImgList
            })
            wx.hideLoading()
          },
          fail: e => {
            wx.hideLoading()
            wx.showToast({
              icon: 'none',
              title: '上傳失敗',
            })
          }
        })

      },
      fail: e => {
        console.log(e)
      }
    })
  }
  
  //刪除圖片
  removeImg(e) {
    //每張圖片上放一個刪除按鈕，並綁定下標，刪除時從數組中經過下標取
    const curIndex = e.currentTarget.dataset.index;
    const curImgList = this.data.uploadImgList;

    wx.cloud.deleteFile({
      fileList: [curImgList[curIndex]],
      success: res => {
        // handle success
        curImgList.splice(curIndex, 1);

        this.setData({
          uploadImgList: curImgList
        })
      },
      fail: err => {
        // handle error
      }
    })
  }
複製代碼

邀請新用戶

這個功能用雲開發實現有點坑，要請求不少次。app

由於這個產品中被邀請的新用戶統一後會與推薦者綁定，之後某些地方消耗的積分會給推薦者返利。因此要考慮的地方仍是挺多的。ide

這個地方就不放代碼了，簡單說下實現的邏輯。測試

每日排行榜/每週排行榜

首先，數據是經過記錄表聚合在一塊兒的，判斷日榜仍是周榜，我是經過時間戳判斷的，好比如今是2019-08-30 14:58，那先用 Date.now() 獲取當前的時間戳A，再獲取今天0點的時間戳B Date.parse(2019-08-30)，判斷A大於等於B便可獲得今日排行榜，周榜也相似。ui

db.collection('coupon_record').aggregate().match({
    timestamp: $.gte(minTimestamp)
  }).group({
    _id: '$openid',
    avatarUrl: $.last('$avatarUrl'),
    nickName: $.last('$nickName'),
    timestamp: $.last('$timestamp'),
    acquireTotal: $.sum('$couponNum')
  }).sort({
    acquireTotal: -1,
    timestamp: 1
  }).limit(10).end()
複製代碼