微信小程序，密码重置

1.首先在个人信息界面显示密码重置选项，然后创建目录password，在wxml设计页面，代码如下：

<!--pages/password/password.wxml-->
<view class='h2'>修改密码</view>
<view class='content'><form bindsubmit="formSubmit"><view class='content_one'><view class='pass'><text>原密码</text><input password='true'name="oldpwd" placeholder='请输入旧密码' /></view><view class='pass'><text>新密码</text><input password='true' name="newpwd" placeholder='请输入新密码' /></view><view class='pass'><text>确认密码</text><input password='true' name="newpwd2" placeholder='请确认一遍密码' /></view></view><button type='primary' form-type="submit" class='btn'>提交</button></form>
</view>

2.在wxss中设计样式，代码如下：

/* pages/password/password.wxss */
.h2{width: 100%;height: 70rpx;background: #acc;color: #fff;line-height: 60rpx;text-align: center;border-radius: 20rpx;
}
page{background: #ddd;
}.content{height:500px;width: 300px;margin:0px auto;display: flex;flex-direction: column;
}
.content_one{width: 500px;height: 280px;/* background: red; */
}
input{height: 40px;border-bottom: 1px solid #ccc;
}
.pass{width: 300px;height: 80px;margin-top: 30rpx;background: #acc;border-radius: 20rpx;
}.btn{width: 300px;
}

3.设计js密码不能为空，输入判断输入旧密码是否正确，确认两次新密码是否一致。代码如下：

// pages/password/password.js
//获取应用实例
const app = getApp();Page({/*** 页面的初始数据*/data: {},formSubmit: function (e) {console.log(e);var oldpwd = e.detail.value.oldpwd;var newpwd = e.detail.value.newpwd;var newpwd2 = e.detail.value.newpwd2;if (oldpwd == '' || newpwd == '' || newpwd2 == '') {wx.showToast({title: '密码不能为空',icon: 'none',duration: 1000})} else if (newpwd != newpwd2) {wx.showToast({title: '两次密码输入不一致',icon: 'none',duration: 1000})} else {// var url = "https://www.lishuming.top/pj/index.php/student/api/setpassword";wx.showLoading({title: '网络请求中......',})wx.request({url: app.globalData.url.setpassword,method: 'POST',data: {no: '1635050307',oldpwd: oldpwd,newpwd: newpwd},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,success: function () {setTimeout(function () {wx.navigateTo({url: '../login/login',})}, 2000)} })}}})}},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

密码重置功能全部完成。

微信小程序，密码重置相关推荐

微信小程序---密码输入
设计支付密码的输入框效果如下: 源码:github地址:https://github.com/fiveTree/-_- 干货: <view class="pay"> ...
ios上微信小程序密码框光标离开提示存储密码解决方案
方案1:在苹果手机上面把 "自动填充密码"关闭,但是苹果这个默认开启,而且大部分客户也不会去自己关闭. 方案2:欺骗苹果手机,代码实现. 先说解决思路,通过测试发现,在账号框不为空 ...
关于微信小程序开发中的显示个人信息以及重置密码功能
最近我们学习了微信小程序中的显示个人信息以及重置密码,因为是老师做好的接口,所以我们只需要搭好前台页面以及编写好JS代码就可以了. 以上是显示个人信息的页面,包含了用户的学号,姓名,系别,班级(因为是 ...
微信小程序开发笔记—设置页面密码
文章目录一.功能概述二.实现效果三.实现方法 1.新建个人登陆页面 2.设计密码获取判别函数和响应函数 1)定义变量 2)设计密码获取判别函数 3)设计响应函数 3.设计页面内容 1)input ...
小程序 sha1和服务器有关系吗,微信小程序使用sha1实现密码加密的方法介绍
微信小程序使用sha1实现密码加密的方法介绍,字符串,程序,转换为,详解,函数微信小程序使用sha1实现密码加密的方法介绍易采站长站,站长之家为您整理了微信小程序使用sha1实现密码加密的方法介绍 ...
微信小程序的搜索和重置功能
微信小程序的搜索和重置功能 wxml <template><div><div class="input-wrap"><el-inputse ...
subject.login(token)是如何确认账号密码的_教你如何删除、关闭、注销微信小程序...
微信小程序是我们日常生活中经常会接触到的工具,打开小程序后,它就会留在我们微信的""发现-小程序"栏.很多人并不知道该如何删除.关闭小程序,所以今天就跟大家科普下相关问题 ...
微信小程序激活账号时，提示“此帐号已激活，请使用帐号密码直接登录”
最近准备研究下微信小程序,先去申请个小程序账号.于是乎,在通过邮件中的链接激活账号时,遇到了这个问题. 解决方法你没看错,就是字面的意思,去登录页,点击使用账号登录,千万不要扫码登录. 用之前注册的 ...
如何给自制的微信小程序设置一个密码
给自制的微信小程序设置密码,需要wxml文件和js文件.本文将wxml文件命名为fenliu.wxml,将js文件命名为fenliu.js. fenliu.wxml文件内容为: <view> ...
又省时间又省心，微信小程序记住密码功能大揭秘
前言微信小程序已经成为现代人生活中不可或缺的一部分,但是每次打开小程序都需要重新输入密码,这让人感到有些麻烦.那么,如何实现微信小程序记住密码呢?本文将为大家详细介绍. 实现思路其实实现的核心思路 ...

微信小程序，密码重置

微信小程序，密码重置相关推荐

最新文章

热门文章