uni-app緩存的使用

 

uni.setStorage(OBJECT)

將數據存儲在本地緩存中指定的 key 中，會覆蓋掉原來該 key 對應的內容，這是一個異步接口。

OBJECT 參數說明

參數名	類型	必填	說明
key	String	是	本地緩存中的指定的 key
data	Any	是	須要存儲的內容，只支持原生類型、及可以經過 JSON.stringify 序列化的對象
success	Function	否	接口調用成功的回調函數
fail	Function	否	接口調用失敗的回調函數
complete	Function	否	接口調用結束的回調函數（調用成功、失敗都會執行）

示例

uni.setStorage({
    key: 'storage_key',// 存放內容的key, 注: key相同會進行覆蓋
    data: 'hello',     // 存放的內容
    success: function () { //存放成功的回調函數
        console.log('success');
    }
});

uni.setStorageSync(KEY,DATA)

將 data 存儲在本地緩存中指定的 key 中，會覆蓋掉原來該 key 對應的內容，這是一個同步接口。

參數說明

參數	類型	必填	說明
key	String	是	本地緩存中的指定的 key
data	Any	是	須要存儲的內容，只支持原生類型、及可以經過 JSON.stringify 序列化的對象

try {
    //將數據存放在以存在的key上,進行覆蓋
    uni.setStorageSync('storage_key', 'hello');
} catch (e) {
    // error
}

uni.getStorage(OBJECT)

從本地緩存中異步獲取指定 key 對應的內容。

OBJECT 參數說明

參數名	類型	必填	說明
key	String	是	本地緩存中的指定的 key
success	Function	是	接口調用的回調函數，res = {data: key對應的內容}
fail	Function	否	接口調用失敗的回調函數
complete	Function	否	接口調用結束的回調函數（調用成功、失敗都會執行）

success 返回參數說明

參數	類型	說明
data	Any	key 對應的內容

示例

uni.getStorage({
    key: 'storage_key', //須要獲取的key
    success: function (res) {//獲取成功的回調
        console.log(res.data);
    }
});

uni.getStorageSync(KEY)

從本地緩存中同步獲取指定 key 對應的內容。

參數說明

參數	類型	必填	說明
key	String	是	本地緩存中的指定的 key

示例

try {
    //須要獲取的key,直接返回內容
    const value = uni.getStorageSync('storage_key');
    if (value) {//判斷是否不爲空
        console.log(value);
    }
} catch (e) {
    // error
}

uni.getStorageInfo(OBJECT)

異步獲取當前 storage 的相關信息。

平臺差別說明

App	H5	微信小程序	支付寶小程序	百度小程序
HBuilderX 2.0.3+	√	√	√	√

OBJECT 參數說明

參數名	類型	必填	說明
success	Function	是	接口調用的回調函數，詳見返回參數說明
fail	Function	否	接口調用失敗的回調函數
complete	Function	否	接口調用結束的回調函數（調用成功、失敗都會執行）

success 返回參數說明

參數	類型	說明
keys	Array＜String＞	當前 storage 中全部的 key
currentSize	Number	當前佔用的空間大小, 單位：kb
limitSize	Number	限制的空間大小, 單位：kb

示例

uni.getStorageInfo({//獲取全部storage中的全部信息
    success: function (res) {//獲取成功的回調
        console.log(res.keys);//當前storage中全部的key
        console.log(res.currentSize);//當前佔用的空間大小,單位:kb
        console.log(res.limitSize);//限制的空間大小,單位:kb
    }
});

uni.getStorageInfoSync()

同步獲取當前 storage 的相關信息。

平臺差別說明

App	H5	微信小程序	支付寶小程序	百度小程序
HBuilderX 2.0.3+	√	√	√	√

示例

try {
    //獲取當前全部storage信息
    const res = uni.getStorageInfoSync();
    console.log(res.keys);//全部的key
    console.log(res.currentSize);//當前佔用空間的大小,單位:kb
    console.log(res.limitSize);//限制空間的大小,單位:kb
} catch (e) {
    // error
}

uni.removeStorage(OBJECT)

從本地緩存中異步移除指定 key。

OBJECT 參數說明

參數名	類型	必填	說明
key	String	是	本地緩存中的指定的 key
success	Function	是	接口調用的回調函數
fail	Function	否	接口調用失敗的回調函數
complete	Function	否	接口調用結束的回調函數（調用成功、失敗都會執行）

示例

uni.removeStorage({ //從本地刪除指定key
    key: 'storage_key',//key
    success: function (res) {//刪除成功的回調
        console.log('success');
    }
});

uni.removeStorageSync(KEY)

從本地緩存中同步移除指定 key。

參數說明

參數名	類型	必填	說明
key	String	是	本地緩存中的指定的 key

示例

try {
    // 從本地刪除指定的key
    uni.removeStorageSync('storage_key');
} catch (e) {
    // error
}

uni.clearStorage()

清理本地數據緩存。

示例

uni.clearStorage();//全部的本地緩存將被清除,異步

uni.clearStorageSync()

同步清理本地數據緩存。

示例

try {
    //清理全部的本地緩存
    uni.clearStorageSync();
} catch (e) {
    // error
}

注意

uni-app的Storage在不一樣端的實現不一樣：

• H5端爲localStorage，瀏覽器限制5M大小，是緩存概念，可能會被清理
• App端爲原生的plus.storage，無大小限制，不是緩存，是持久化的
• 各個小程序端爲其自帶的storage api，數據存儲生命週期跟小程序自己一致，即除用戶主動刪除或超過必定時間被自動清理，不然數據都一直可用。
• 微信小程序單個 key 容許存儲的最大數據長度爲 1MB，全部數據存儲上限爲 10MB。
• 支付寶小程序單條數據轉換成字符串後，字符串長度最大200*1024。同一個支付寶用戶，同一個小程序緩存總上限爲10MB。
• 百度、頭條小程序文檔未說明大小限制

除此以外，其餘數據存儲方案：

• H5端還支持websql、indexedDB、sessionStorage
• App端還支持SQLite、IO文件等本地存儲方案。

官方網址