微信小程序忘记密码

一:找到注册登录页面


二:点击忘记密码


代码如下

<!--pages/forgetpassword/forgetpassword.wxml-->
<!-- <text>pages/forgetpassword/forgetpassword.wxml</text> -->
<view class='father'>
<form bindsubmit='submit_email' wx:if="{{form_index == 0}}">
<view class='header'>
<text class='pwd'>找回密码:第一步</text>
</view>
<view class='content'>
<view class='message'>
<input name="no" type='number' placeholder-class='small' placeholder='请输入学号'></input>
</view>
<view class='message'>
<input name="email" placeholder-class='small' placeholder='请输入绑定邮箱'></input>
</view>
<view class='bottom'>
<button type='primary' placeholder-class='small' formType="submit" >下一步</button>
</view>
</view>
</form>



<form bindsubmit='submit_password' wx:else>
<view class='header'>
<text class='pwd'>找回密码:第二步</text>
</view>
<view class='content'>
<view class='message'>
<input name="pwd" password="{{mask}}" placeholder-class='small' placeholder='请输入新密码'></input>
</view>
<view class="right">
<!-- 切换 -->
<switch bindchange="switchChange"/>
</view>
<view class='message'>
<input name="validcode" type='number' placeholder-class='small' placeholder='输入邮箱中的验证码'></input>
</view>
<view class="right">
<text style="color:#aaa">剩余:{{second}}秒</text>
</view>
<view class='bottom'>
<button type='primary' formType="submit" disabled="{{disabled}}" >提交</button>
</view>
</view>
</form>
</view>



// pages/forgetpassword/forgetpassword.js
const app = getApp();

function countdown(that) {
var second = that.data.second
if (second == 0) {
that.setData({
disabled: true
});
return;
}
var time = setTimeout(function () {
that.setData({
second: second - 1
});
countdown(that);
}
, 1000)
}


Page({

/**
* 页面的初始数据
*/
data: {
form_index: 0,
no: null,
second: 30,
disabled: false,
mask: true

},
//切换
switchChange: function (e) {
// console.log(e.detail.value)
this.setData({ mask: !e.detail.value })
},
//提交邮箱
submit_email: function (e) {
var no = e.detail.value.no;
var email = e.detail.value.email;

if (email == null || email == '') {
wx.showToast({
title: '请输入邮箱',
icon: 'none',
duration: 2000
})
return;
}

wx.showLoading({
title: '网络请求中...',
})
wx.request({
url: app.globalData.url.forgotpwd,
data: {
no: no,
email: email
},
method: "POST",
header: {
'content-type': 'application/x-www-form-urlencoded'
},
success: (res) => {
wx.hideLoading();
// console.log(res.data);
if (res.data.error) {
wx.showToast({
title: res.data.msg,
icon: 'none',
duration: 2000
})
} else {
this.setData({ no: no, second: res.data.expire });
countdown(this);
wx.showToast({
title: res.data.msg,
icon: 'none',
duration: 2000
})
setTimeout(() => {
this.setData({ form_index: 1 });
}, 2000)

}
}

})
},
//重设密码
submit_password: function (e) {
console.log(e);

var validcode = e.detail.value.validcode;
var pwd = e.detail.value.pwd;

if (validcode == '' || validcode == null || pwd == '' || pwd == null) {
wx.showToast({
title: '验证码和密码不能为空',
icon: 'none',
duration: 2000
})
} else {
wx.request({
url: app.globalData.url.initpassword,
method: 'POST',
data: {
no: this.data.no,
validcode: validcode,
pwd: pwd
},
header: {
'content-type': 'application/x-www-form-urlencoded'
},
success: (res) => {
// console.log(res.data);
if (res.data.error) {
wx.showToast({
title: res.data.msg,
icon: 'none',
duration: 2000
})
} else {
wx.showToast({
title: res.data.msg,
icon: 'success',
duration: 2000
})
setTimeout(() => {
wx.navigateBack({
delta: 1
})
}, 2000)
}
}
})
}

},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {

},

/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {

},

/**
* 生命周期函数--监听页面显示
*/
onShow: function () {

},

/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {

},

/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {

},

/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {

},

/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {

},

/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {

}
})

第三步:输入信息


第四步:点击下一步


第五步:点击提交

然后跳转到登录页面

阅读更多
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页