ホームページ  >  記事  >  ウェブフロントエンド  >  WeChatミニプログラムの機能概要(詳細チュートリアル)

WeChatミニプログラムの機能概要(詳細チュートリアル)

亚连
亚连オリジナル
2018-06-21 18:43:412892ブラウズ

この記事では、携帯電話番号認証、パスワード認証、認証コード*を取得するための関連コードなどのWeChatミニプログラム機能を主に紹介します。これは非常に優れており、必要な友人は参考にすることができます。以下は小さなコードです。WeChat ミニ プログラム機能のパスワード認証 * を紹介します。具体的なコードは次のとおりです。

//登录输入密码
userPasswordInput: function (e) {
var that = this;
this.setData({
userPassword: e.detail.value
})
// console.log(e.detail.value.length)
// console.log(e.detail.value);
var value = e.detail.value
var strkong = /^[0-9a-zA-Z]{0,25}$/g;
if (strkong.test(value)) {
that.setData({
truePwd: true
})
} else {
// console.log("cwoca")
wx.showModal({
title: '提示',
content: '密码由0~25位由数字和26个英文字母混合而成',
showCancel: false,
success: function (res) {
that.setData({
truePwd: false
})
}
})
}
},
次に、WeChat ミニ プログラム機能の携帯電話番号認証 * 、具体的なコードを紹介します。

// 登录手机验证
loginPhone: function (e) {
var phone = e.detail.value;
if (!(/^1[34578]\d{9}$/.test(phone))) {
this.setData({
ajxtrue: false
})
if (phone.length >= 11) {
wx.showToast({
title: '手机号有误',
icon: 'success',
duration: 2000
})
}
} else {
this.setData({
ajxtrue: true
})
}
},
次のコードは、検証コード*を取得するための WeChat アプレット関数を紹介します。具体的なコードは次のとおりです:

yanZhengInput: function (e) {
var that = this;
var yanzheng = e.detail.value;
var huozheng = this.data.huozheng
console.log(e.detail.value)
that.setData({
yanzheng: yanzheng,
zhengTrue: false,
})
if (yanzheng.length >= 4) {
if (yanzheng == huozheng) {
that.setData({
zhengTrue: true,
})
} else {
that.setData({
zhengTrue: false,
})
wx.showModal({
content: '输入验证码有误',
showCancel: false,
success: function (res) {
}
})
}
}
},
yanzhengBtn: function () {
// console.log(app.globalData.userId);
var getChange = this.data.getChange
var n = 59;
var that = this;
var phone = this.data.linPhone;
console.log(phone)
var user = wx.getStorageSync('user');
if (!(/^1[34578]\d{9}$/.test(phone))) {
wx.showToast({
title: '手机号有误',
icon: 'success',
duration: 2000
})
} else {
if (getChange) {
this.setData({
getChange: false
})
var time = setInterval(function () {
var str = '(' + n + ')' + '重新获取'
that.setData({
getText: str
})
if (n <= 0) {
that.setData({
getChange: true,
getText: &#39;重新获取&#39;
})
clearInterval(time);
}
n--;
}, 1000);
wx.request({
url: &#39;https://www.didu86.com/Clothes-manager-web/codenum&#39;,
data: {
tel: phone,
},
header: {
&#39;content-type&#39;: &#39;application/json&#39;
},
success: function (res) {
var result = res.data.code;
console.log(result)
that.setData({
huozheng: result,
})
}
})
}
}
},
上記は、私があなたのためにコンパイルしたものです。将来的に役立つことを願っています。 関連記事:

vue + elementでテーブルページングを実装する方法

WeChatアプレットに記録と再生の記録機能を実装する方法

Nuxt.jsフレームワーク(詳細なチュートリアル)

での方法JS+CSS でローリングデジタル時計を実装するには

以上がWeChatミニプログラムの機能概要(詳細チュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。