Uniapp 数据持久化
一、在uniapp中使用
uni.getStorage({ key: 'storage_key', success: function (res) {console.log(res.data);}}); uni.setStorage({key:'storage_key',data:'',success:function(){ console.log('success'); } });
在不同端的实现不同
1.H5端为localStorage，浏览器限制5M大小，是缓存概念，可能会被清理 (localStorage.setItem(), localStorage.getItem())
2.App端为原生的plus.storage，无大小限制，不是缓存，是持久化的(plus.storage.setItem(), plus.storage.getItem())
注意：（localStorage 存储和取值方式适用数据量较小的数据操作
虽然 plus.storage 大小没有限制，但是plus.storage的存储与获取较慢，原因是 js和原生通信慢。如果使用plus.storage存取数据量较大的数据可以一次性存入或取出，避免频繁操作，影响性能。 ）
二、大量数据，还可以用sqlite，一批一次性写入sqlite（仅可以在手机端使用）
1.sqlite使用方法
（首先需要打开sqlited的db库 ->创建表->操作表）
2.具体操作流程：
首先需要在manifest.json的App模块配置里面勾选SQLite(数据库)模块
3.封装出sqlite使用方法
function openComDB(name, path, callback) {
plus.sqlite.openDatabase({
name: name,
path: path,
success: function(e) {
console.log(‘打开数据库成功’)
callback(e)
},
fail: function(e) {
console.log(‘打开数据库失败’)
callback(e);
}
})
}
function executeSQL(name, sql, callback) {
plus.sqlite.selectSql({
name: name,
sql: sql,
success: function(e) {
// console.log("查询数据库:" + name + ",表:" + sql + ";的");
callback(e);
},
fail: function(e) {
console.log("查询数据库失败:" + JSON.stringify(e));
callback(e);
}
})
}
export{
openComDB,
executeSQL
}
在需要用到的vue文件下，引入上方function； 路径是自己的
eg: import {openComDB,executeSQL} from ‘@/common/sqlite.js’
4.进入页面调用数据库时，要先打开数据库（调用方法openComDB开启数据库），开启后才可以对数据进行增删改查。
//SQLite
openComDB('loc', '_doc/sqlite.db', res => {
console.log('打开数据库');
});
5.接下来时初始化数据（当前数据库已开启的情况下）
创建自己的数据表
createTable() {
var sqlTable = 'create table if not exists Table("id" INT(10) NOT NULL UNIQUE,"name" CHAR,"gridCode" CHAR)'
executeSQL('loc', sqlTable, res => {
//向表中插入数据
this.inserteCode()
})
},
inserteCode(){
for (var i = 0; i < this.sqliteData.length; i++) {
var sqlInsert = "insert into Table values('";
sqlInsert += this.sqliteData[i].[对应属性]+ "'";
sqlInsert += ')';
executeSQL('loc', sqlInsert, res => {//查询数据库数据 可以在这里把sqlite 数据赋值给绑定的data}) }
}
以上是uniapp 使用sqlite数据库，存储与获取sqlite数据库数据过程
6.操作sqlite数据库的增删改查
1.数据查询
Var querySqlite = 'select * from '
plus.sqlite.selectSql({
name: 'loc',
sql: querySqlite + name, //查询语句
success: res => {
console.log("数据库更新成功");
resolve(res)
},
fail: res => {
console.log("数据库更新失败");
reject(res)
}
})
2.数据添加
Var addSqlite = 'insert into userInfo(id,name,gender,avatar) values("'+id+'","'+name+'")'
plus.sqlite.executeSql({
name:'pop',
sql:addSqlite ,//添加语句
success(e){
console.log("数据库更新成功");
resolve(e);
},
fail(e){
console.log("数据库更新失败");
reject(e);
}
})
3.数据修改
var sqlUpdate = 'update '+name+' set '+lable+'="'+val+'"'+' where '+idx+'="'+idxval+'"'; //更新语句
plus.sqlite.executeSql({
name: 'loc',
sql: sqlUpdate ,
success: function(e) {
console.log("数据库更新成功");
},
fail: function(e) {
console.log("数据库更新失败");
// failCb(e);
}
})
4.数据删除
var sqlDelete = 'delete from '+name+' where '+sol+'="'+data+'"';//删除语句
plus.sqlite.executeSql({
name:'loc',
sql:sqlDelete ,
success(e){
console.log("数据库更新成功");
resolve(e);
},
fail(e){
console.log("数据库更新失败");
reject(e);
}
})
