This article mainly introduces the relevant information of WeChat Mini Program cache (local cache, asynchronous cache, synchronous cache). Friends in need can refer to
WeChat Mini Program Cache
About local cache
1.wx.setStorage(wx.setStorageSync)、wx.getStorage(wx.getStorageSync)、wx.clearStorage(wx.clearStorageSync)
You can set, get and clean the local cache. The maximum local cache is 10MB
2.localStorage is permanent storage
1. Asynchronous cache
wx. setStorage(OBJECT)
Store the data in the specified key in the local cache, and will overwrite the original content corresponding to the key
wx.setStorage({ key:"key", data:"value" })
wx.getStorage(OBJECT)
Asynchronously obtain the content corresponding to the specified key from the local cache.
wx.getStorage({ key: 'key', success: function(res) { console.log(res.data) } })
wx.getStorageInfo(OBJECT)
Asynchronously obtain relevant information about the current storage
wx.getStorageInfo({ success: function(res) { console.log(res.keys) console.log(res.currentSize) console.log(res.limitSize) } })
wx.removeStorage(OBJECT)
Asynchronously remove the specified key from the local cache.
wx.removeStorage({ key: 'key', success: function(res) { console.log(res.data) } })
2. Synchronization cache
wx.setStorageSync(KEY,DATA)
Storing data in the specified key in the local cache will overwrite the original content corresponding to the key. This is a synchronization interface.
wx.getStorageSync(KEY)
Synchronously obtain the content corresponding to the specified key from the local cache.
wx.getStorageInfoSync
Synchronously obtain relevant information about the current storage
wx.removeStorageSync(KEY)
Synchronically remove the specified key from the local cache.
3. Clear the cache
wx.clearStorage()
Clear the local data cache.
wx.clearStorageSync()
Synchronically clear the local data cache
About the difference between synchronous cache and asynchronous cache
Everything ending with Sync (synchronous, simultaneously) is a synchronous cache. The difference between the two is that asynchronous will not block the current task, and the synchronous cache cannot continue until the synchronization method is processed. implement.
But generally do not clear all caches. If you want to clear the corresponding cache, just set the corresponding cache content to an empty array
About historical search
搜索 历史搜索 删除搜索历史 {{item == null?'暂无数据':item}}
Page
There are three binding events here
bindinput=" searchNameInput" Get the data entered by the user
bindtap="setSearchStorage" Set local storage
##bindtap="deleteHistory" Delete historical search
//获取用户输入框的值 searchNameInput:function(e){ var that = this; that.setData({ inputValue:e.detail.value }) } e.detail.value就代表了当前输入值
//将用户输入的内容存入本地缓存,并且将搜索数据放到首页 setSearchStorage:function(){ var that = this if(this.data.inputValue != ''){ //调用API向本地缓存存入数据 var searchData = wx.getStorageSync('searchData') || [] searchData.push(this.data.inputValue) wx.setStorageSync('searchData', searchData) //读取用户搜索商品 var name = this.data.inputValue wx.request({ url: 'www.shop.com/home/product/search', data: {name:name}, method: 'GET', success: function(res){ that.setData({ goodsList: res.data.info, }) }, }) } }
var searchData = wx.getStorageSync('searchData') || []
Get the local cache named 'searchData'. If the cache 'searchData' does not exist, it is equivalent to recreating it. Empty array, assigned to the searchData variablesearchData.push(this.data.inputValue)
PUSH the value entered by the user into the searchData variablewx.setStorageSync('searchData', searchData)
Call the API interface and reset the cached value of key = 'searchData' to equal searchData The following The wx.request is the content of the requested data. I'm tired of talking about it, but it's impressive enough. There is no bindtap to get the cache, just get it and add it to the data in the Page//从本地获取历史搜索数据 var searchData = wx.getStorageSync('searchData')||[] this.setData({ searchData:searchData }) deleteHistory //删除历史搜索数据 deleteHistory:function(){ var that = this wx.showModal({ title: '提示', content: '是否删除历史搜索', success: function(res) { if (res.confirm) { wx.setStorageSync('searchData', []); wx.switchTab({ url: '/pages/index/index', }) } } }) }
WeChat Mini Program Pop-up window customization code
Implementation of message prompt box of WeChat applet
The above is the detailed content of Analysis of cache in WeChat applet. For more information, please follow other related articles on the PHP Chinese website!