响应式数据本地存储开源算法

监听变量变化,实时同步数据到本地存储中,实现数据持久化

设置默认配置

livestorage.setConfig(config)

配置参数说明
参数 示例 描述
storage 'localStorage' 数据存储方式,参考值:'localStorage','sessionStorage','cookie'
domain '' 域名仅storage为'cookie'时有效
path '/' 路径仅storage为'cookie'时有效
period 36000000 有效期仅storage为'cookie'时有效
secure false 安全传输仅storage为'cookie'时有效
encode true 是否加密存储
mount '' 通过选择器绑定节点
onChanged function(){} 数据变动时触发事件处理

监听数据

livestorage.watchItem(key,initialValue,config)

对直接量进行设置

// 和input进行数据双向绑定,同时同步到本地存储(localStorage)中 let data = liveStorage.watchItem('username','Michael',{ 'mount':'input[name="username"]' }); // 改变数据的值,即可实时更新本地存储(localStorage) data.value = 'Jafferson';

对对象或数组进行设置

// 将用户数据存储到Cookie中,并存储7天 let user = liveStorage.watchItem('person',{ 'name':'Michael', 'age':18 },{ 'storage':'cookie', 'period':{ 'day':7 } }); // 改变数据的值,即可实时更新本地存储(localStorage) user.name = 'Jafferson'; user.age = 24;

设置数据

setItem(key,value,config)

对基础数据直接设置

// 字符串设置 liveStorage.setItem('name','Michael'); // 数字设置 liveStorage.setItem('age',18); // 对象设置 liveStorage.setItem('user',{ 'name':'Li Lei', 'age':24, 'interest':['basketball','football'] }); // 时间设置 liveStorage.setItem('starttime',new Date()); // 正则设置 liveStorage.setItem('match',/\d{6}/); // 数组设置 liveStorage.setItem('list',[2,4,6,8,10]);

获取数据

getItem(key)

let name = liveStorage.getItem('name');

移除数据

removeItem(key)

liveStorage.removeItem('name');

清空数据

clear()

liveStorage.clear();

获取数据条数

length

console.log('[当前存储数据条数]',liveStorage.length);
算法开源

算法基于「MIT许可协议」开源,除需在源码中保留版权信息和许可声明外,你有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。数据持续更新中,如发现错漏或有想法建议可在此 反馈问题


响应式数据本地储存脚本:

https://passer-by.com/livestorage/dist/livestorage.min.js

Copyright © passer-by.com