The content of this article is about how to implement the WeChat applet verification code? (Source code), it has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Verification code:

<input bindinput="makecodeInput" type="text">
<view bindtap="getcode" class="makecode">{{code}}</view><button bindtap="login">登錄</button>

index.js

data: {
code: "",
makecode:"",
},
//獲取輸入驗(yàn)證碼
makecodeInput:function（e）{
this.setData（{
makecode:e.detail.value
}）
},
// 登錄
login: function（） {
if（this.data.makecode != this.data.code）{
wx.showToast（{
title: '驗(yàn)證碼不正確',
icon: 'none',
duration: 2000
}）
}
},
//驗(yàn)證碼
createCode（） {
var code;
//首先默認(rèn)code為空字符串
code = '';
//設(shè)置長度，這里看需求，我這里設(shè)置了4
var codeLength = 4;
//設(shè)置隨機(jī)字符
var random = new Array（0, 1, 2, 3, 4, 5, 6, 7, 8, 9）；
//循環(huán)codeLength 我設(shè)置的4就是循環(huán)4次
for （var i = 0; i < codeLength; i++） {
//設(shè)置隨機(jī)數(shù)范圍，這設(shè)置為0 ~ 10
var index = Math.floor（Math.random（） * 10）；
//字符串拼接 將每次隨機(jī)的字符 進(jìn)行拼接
code += random[index];
}
//將拼接好的字符串賦值給展示的code
this.setData（{
code: code
}）
},
/**
* 生命周期函數(shù)--監(jiān)聽頁面加載
*/
onLoad: function（options） {
this.createCode（）；
},
getcode: function（） {
this.createCode（）；
},

The above is how to implement the WeChat applet verification code? (source code) full introduction, if you want to know more about WeChat applet development tutorial, please pay attention to the PHP Chinese website.

The above is the detailed content of How to implement WeChat applet verification code? (source code). For more information, please follow other related articles on the PHP Chinese website!