uniapp持久化存储
uniapp持久化存储方法
本地存储（LocalStorage）
使用uni.setStorage和uni.getStorage进行数据存储和读取，适合较小数据量的持久化存储。数据以键值对形式保存，关闭应用后依然存在。
// 存储数据
uni.setStorage({
key: 'key_name',
data: 'value'
});
// 读取数据
uni.getStorage({
key: 'key_name',
success: function(res) {
console.log(res.data);
}
});同步本地存储
同步方法会阻塞当前线程直到操作完成，适合需要立即获取结果的场景。
try {
uni.setStorageSync('key_name', 'value');
const value = uni.getStorageSync('key_name');
} catch (e) {
// 错误处理
}数据库存储（SQLite）
对于复杂数据结构，可以使用SQLite数据库。需通过条件编译区分平台，H5端无法直接使用。
// #ifdef APP-PLUS
const db = plus.sqlite.openDatabase({
name: 'db_name',
path: '_doc/test.db'
});
db.executeSql('CREATE TABLE IF NOT EXISTS test(id INTEGER PRIMARY KEY, name TEXT)');
// #endif文件系统存储
通过uni.saveFile和uni.getFileSystemManagerAPI操作文件系统，适合存储较大数据或二进制文件。
uni.downloadFile({
url: 'https://example.com/file',
success: res => {
uni.saveFile({
tempFilePath: res.tempFilePath,
success: savedFile => {
console.log(savedFile.savedFilePath);
}
});
}
});全局变量与Vuex
配合持久化存储使用，将Vuex状态通过插件定期写入本地存储。需安装vuex-persistedstate等插件实现自动同步。
import createPersistedState from 'vuex-persistedstate';
const store = new Vuex.Store({
plugins: [createPersistedState({
storage: {
getItem: key => uni.getStorageSync(key),
setItem: (key, value) => uni.setStorageSync(key, value),
removeItem: key => uni.removeStorageSync(key)
}
})]
});注意事项
- 本地存储有大小限制（通常5MB-10MB），超出可能导致写入失败
- 敏感信息应加密后存储，避免使用持久化存储保存密码等关键数据
- iOS平台可能自动清理长期未使用的LocalStorage数据
- 微信小程序端需注意代码包大小限制影响存储空间
