微信小程序?qū)W習筆記之本地數(shù)據(jù)緩存功能詳解
本文實例講述了微信小程序?qū)W習筆記之本地數(shù)據(jù)緩存功能。分享給大家供大家參考,具體如下:
前面介紹了微信小程序獲取位置信息操作。這里再來介紹一下微信小程序的本地數(shù)據(jù)緩存功能。
【將數(shù)據(jù)存儲在本地緩存】wx.setStorage
【讀取本地緩存】wx.getStorage
以手機號+密碼登錄為例,把登錄成功返回的token值存儲在本地緩存中,然后讀取緩存中的token:
login.php:
<?php
header("Content-type:text/html;charset=utf-8");
$arr = array("state"=>0,"data"=>array(),"msg"=>'');
$phone = $_POST['phone'];
$password = $_POST['password'];
if($phone && $password){
//省略驗證......
//返回登錄token
$tokenstr = 'liweishan666';
$token = $phone.time().$tokenstr;//省略加密
$arr['state'] = 1;
$arr['msg'] = '登錄成功';
$arr['data']['token'] = $token;
}else{
$arr['msg'] = '參數(shù)錯誤';
}
echo json_encode($arr);
die;
login.wxml:
<form bindsubmit="formSubmit" bindreset="formReset">
<view>
手機號:<input type="text" name="phone" placeholder="請輸入賬號" confirm-type="done" />
密碼:<input password type="number" name="password" placeholder="請輸入6位密碼" maxlength="6" />
</view>
<view class="btn-area">
<button formType="submit">登錄</button>
</view>
<view class="btn-area">
<button bindtap="gettoken">讀取緩存token</button>
</view>
<view class="btn-area">{{token}}</view>
</form>
login.js:
Page({
formSubmit: function (e) {
wx.request({
url: 'https://www.msllws.top/login.php',
data: {
'phone': e.detail.value.phone,
'password': e.detail.value.password
},
method: 'POST',
header: {
'Content-Type': 'application/x-www-form-urlencoded'
},
success: function (res) {
console.log(res.data);
//以鍵值對的形式存儲到本地緩存
wx.setStorage({
key: "token",
data: res.data.data.token
})
},
fail: function () { },
complete: function () { }
})
},
gettoken: function (e) {
var that = this
wx.getStorage({
key: 'token',
success: function (res) {
that.setData({'token': res.data})
},
fail: function () { },
complete: function () { }
})
}
})
實現(xiàn)緩存的存儲和讀?。?/p>

【從緩存中移除指定數(shù)據(jù)】wx.removeStorage
wx.removeStorage({
key: 'token',
success (res) {
console.log(res.data)
}
})
【清除全部緩存數(shù)據(jù)】wx.clearStorage
wx.clearStorage()
希望本文所述對大家微信小程序開發(fā)有所幫助。
相關文章
JavaScript實現(xiàn)圖片懶加載的三種方案詳解
圖片懶加載,當圖片出現(xiàn)在可視區(qū)域再進行加載,提升用戶的體驗,這篇文章主要為大家整理了三個常用的圖片懶加載實現(xiàn)方法,希望對大家有所幫助2023-12-12
JavaScript DOMContentLoaded事件案例詳解
這篇文章主要介紹了JavaScript DOMContentLoaded事件案例詳解,本篇文章通過簡要的案例,講解了該項技術的了解與使用,以下就是詳細內(nèi)容,需要的朋友可以參考下2021-09-09
javascript Onunload與Onbeforeunload使用小結(jié)
Onunload,onbeforeunload都是在刷新或關閉時調(diào)用,可以在<script>腳本中通過window.onunload來指定或者在<body>里指定。區(qū)別在于onbeforeunload在onunload之前執(zhí)行,它還可以阻止onunload的執(zhí)行。2009-12-12

