微信小程式之繫結銀行卡功能實現

DevinZ發表於2019-02-19

最近做微信小程式,有個需求要求使用者上傳銀行卡資訊,所以擼了個頁面以及邏輯,詳情程式碼以及使用參照示例,如果對你有所幫助的請給個Star✨~

github.com/ZBK1nger/ba…

螢幕快照 2018-05-29 下午2.03.10.png
如上圖所示,基本的頁面就是這樣,在這主要有這麼幾個點

  • 驗證手機號的正確(手機號位數,正則判斷手機號格式)
  • 輸入銀行卡號後在卡型別下自動匹配成當前銀行卡所屬銀行以及卡型別(如中國建設銀行儲蓄卡)
  • 點選提交像伺服器提交資料時進行判斷(比如收款人姓名填沒填寫,銀行卡號填沒填寫等等)

這裡主要說下說下屬於銀行卡自動匹配銀行卡資訊的邏輯,在當前銀行卡的bindinput方法中,時刻監聽使用者輸入的值,然後根據util.js中的bankCardAttribution方法來判斷

getUserIdCardNumber: function (e) {
    this.setData({
      bankNumber: e.detail.value
    })
    var temp = util.bankCardAttribution(e.detail.value)
    console.log(temp)
    if (temp == Error) {
      temp.bankName = '';
      temp.cardTypeName = '';
    }
    else {
      this.setData({
        cardType: temp.bankName + temp.cardTypeName,
      })
    }
  },
複製程式碼

如果驗證銀行卡號正確的話會返回我們一段這樣的json,然後就隨便.你需要的資訊了 ?

螢幕快照 2018-05-29 下午2.35.33.png

相關文章