app接码教程，附源码

写在前面
短信验证现在做项目几乎是必备技能，现在我帮我最近这个项目的这一功能实现分享给大家，希望有所帮助。
先上效果图

html代码

<view class="match-row form-item">
			<view class="title">手机号</view>
			<input placeholder-class="in-text" :disabled="IDNumber != ''?true:false" placeholder="请输入手机号" v-model="Phone" @blur="checkPhone" />
			<view class="checking" @tap="handleCode" v-if="IDNumber == ''">{{codeBtn}}</view>
		</view>
		<view class="match-row form-item" v-if="IDNumber == ''">
			<view class="title">短信验证码</view>
			<input class="input-text" v-model="code" placeholder="请输入短信验证码" placeholder-class="in-text" type="text" />
		</view>

js代码

data() {
			return {
				Phone: '',
				codeBtn: '获取验证码',
				code: '',
				isClick2: true,
			};
		},
methods: {
			//获取验证码
			handleCode() {
				var that = this;
				let count = 60;
				if (that.Phone == '') {
					uni.showToast({
						title: '手机号不能为空',
						duration: 1000,
						icon: 'none'
					});
				} else if (that.isClick2) {
					that.isClick2 = false;
					let timer = setInterval(function() {
						count--;
						that.codeBtn = '获取中(' + count + ')';
						if (count == 0) {
							that.isClick2 = true;
							clearInterval(timer)
							that.codeBtn = '重新获取';
						}
					}, 1000)
					that.utils.sendRequest('/api/publicc/send_code', 'GET', {
						mobile: that.Phone
					}).then(function(res) {
						if (res.data.code == 1) {
							uni.showToast({
								title: '已发送，请注意查收',
								duration: 1000,
								icon: 'none'
							});
						}
					})
				}

			},
		},

创作不易，点个赞吧！！

版权声明：如无特殊说明，文章均为本站原创，转载请注明出处
本文链接：https://blog.csdn.net/wsad861512140