微信小程序 本地存储及登录页面处理实例详解
实例内容
登录界面:在 保存后,自动生成相关文件(挺方便的)。 修改视图文件 修改登陆样式 看下样式: form相关属性:
这里用到了bindsubmit,用于处理提交的表单数据。 input相关属性
button相关属性
此Demo中将button的formType设置为submit用于激活表单提交事件。 实例二: 处理登陆表单数据修改login.js //获得表单数据
var objData = e.detail.value; if(objData.userName && objData.userPassword){ //跳转到成功页面 console.log(userName); },onReady:function(){ 这里使用到了wx.getStorageSync和wx.setStorageSync,这里说一下,上面这两个方法类似于HTML5的本地存储,属于同步存储方式。 这两个方法,使用很简单,列下参数: wx.setStorageSync(KEY,DATA)
wx.getStorageSync
修改一下login.wxml 姓 名:
这个小实例,会在登陆的时候,将登陆信息存到本地存储,当下次登陆时,如果本地存储中有相应信息,则直接填写上。 效果(再一次运行后,自动填写上了信息):实例三: 处理登陆表单数据(异步)这里采用异步的方式存放数据。 修改一下 //获得表单数据
var objData = e.detail.value; if(objData.userName && objData.userPassword){ //跳转到成功页面
|
类型 | 必填 | 说明 |
---|---|---|
wx.getStorage(OBJECT)
类型 | 必填 | 说明 |
---|---|---|
实例四: 清除本地数据
这里就不详细写了,直接介绍一下这两个清除本地数据的方法。
wx.clearStorage()
wx.clearStorageSync()
直接执行即可实现。
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
(编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!