1.設置驗證碼按鈕

//opacity是為了讓用戶點擊一次獲取驗證碼后讓按鈕顏色變淡，并倒計時顯示60秒
//timer 一開始默認值為 '獲取驗證碼'
<view style="opacity: {{opacity}}" bindtap='sendCodeClick'>{{timer}}</view>

2.調用驗證碼接口戈咳，并傳入手機號

    //獲取驗證碼
    getCode = function () {
     //一般短信驗證碼獲取主要是傳入手機號心软，有不同需求還可以傳不同值
      var data={
        mobile:that.data.mobile, //手機號
        type:1,
      }
      //后端功能接口問公司后臺人員要
      //調用接口壕吹，我個人后臺接口進行了Promise,這邊主要是調用獲取驗證碼接口，并通過res來判斷是否發(fā)生成功
      sendCode(data).then(res=>{
        wx.showToast({
          title: '發(fā)送成功',
          icon: 'success',
          duration: 1000
        });
      })
    }

接口封裝可以看請求相關封裝

3.驗證碼按鈕事件sendCodeClick

  sendCodeClick: function () {
    var that = this;
    if (that.data.timer != '獲取驗證碼') { 
      //判斷有沒有點擊獲取驗證碼按鈕删铃，有點擊的話會把獲取驗證碼按鈕的文字變?yōu)檫€剩多少秒
      //在倒計時結束前都不能再進行獲取驗證碼操作
      return false;
    }
    if (that.data.mobile == '') { //如果電話等于空提示請輸入手機號
      wx.showModal({
        title: '提示',
        confirmColor: '#0661F6',
        content: '請輸入手機號碼',
        showCancel: false
      })
      return;
    }
    if (!(/^1[3456789]\d{9}$/.test(that.data.mobile))) { 
      //對輸入的手機號進行正則匹配耳贬，看是否符合格式，如果不符合進行彈窗提示
      wx.showModal({
        title: '提示',
        content: '手機號碼格式不正確',
        confirmColor: '#0661F6',
        showCancel: false
      });
      return;
    } 
    getCode(); //如果都沒以上問題就可以正確調用發(fā)送getCode()方法
    var time = 60;  //初始化一個倒計時時間
    var setTime = function () {    //設置倒計時方法
      if (time > 0) {   //如果時間還大于0就是倒計時還沒結束
        setTimeout(function () {   //定時器
          time--;   //每次減一秒
          that.setData({  //減完并設置按鈕顯示文字timer為還剩多少秒猎唁，并讓按鈕顏色變淡
            timer: '還剩' + time + '秒',
            opacity: 0.43
          })
          setTime(); //遞歸調用效拭，重復執(zhí)行定時器操作直到時間為0退出
        }, 1000);
      } else {  //退出定時后，把按鈕文字重新設置為獲取驗證碼胖秒，按鈕設置為完全顯示
        that.setData({
          timer: '獲取驗證碼',
          opacity: 1
        })
      }
    }
    setTime();   //執(zhí)行倒計時方法
  },