Layui的本地存储方法-Layui.data的基本使用
本地存储是对 localStorage 和 sessionStorage 的友好封装,可更方便地管理本地数据。
- localStorage 持久化存储:layui.data(table, settings),数据会永久存在,除非物理删除。
- sessionStorage 会话性存储:layui.sessionData(table, settings),页面关闭后即失效。注:layui 2.2.5 新增
上述两个方法的使用方式是完全一样的。其中参数 table 为表名,settings是一个对象,用于设置key、value。
//【增】:向test表插入一个nickname字段,如果该表不存在,则自动建立。
layui.data('test', {
key: 'nickname'
,value: 'ABC'
}); //【删】:删除test表的nickname字段
layui.data('test', {
key: 'nickname'
,remove: true
});
layui.data('test', null); //删除test表 //【改】:同【增】,会覆盖已经存储的数据 //【查】:向test表读取全部的数据
var localTest = layui.data('test');
console.log(localTest.nickname); //获得“ABC”
示例操作
//简单操作
layui.data('cate', {
key: 'data'
,value: [{
key: 'id'
,value: 1
},{
key: 'name'
,value: 'abc'
}]
}); //取值
var cate = layui.data('cate');
console.log(cate.data)
//复杂操作
layui.data('cate', {
key: 'data',
value: [
{date: 'id', id: 1, content:'00000'}
,{date: 'id', id: 2, content:'11111'}
,{date: 'id', id: 3, content:'22222'}
,{date: 'id', id: 4, content:'33333'}
]
}); //追加数据
var cates = layui.data('cate').data;
cates.push({date: 'id', id: 5, content:'4444444'}); //移除数据
cates.splice(2,1); //更新操作
layui.data('cate', {
key: 'data',
value: cates
}); console.info(layui.data('cate'));
Layui的本地存储方法-Layui.data的基本使用的更多相关文章
- json常用方法和本地存储方法
1.JSON.parse()[把json字符串解析成json对象] 2.JSON.stringify()[把json对象中解析成json字符串] <script> let obj = '{ ...
- HTML5本地存储(Local Storage) 的前世今生
长久以来本地存储能力一直是桌面应用区别于Web应用的一个主要优势.对于桌面应用(或者原生应用),操作系统一般都提供了一个抽象层用来帮助应用程序保存其本地数据 例如(用户配置信息或者运行时状态等). 常 ...
- todolist 包含本地存储知识
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- H5本地存储:sessionStorage和localStorage
作者:心叶时间:2018-05-01 18:30 H5提供了二种非常好用的本地存储方法:sessionStorage和localStorage,下面分别介绍一下: 1.sessionStorage:保 ...
- 关于本地存储构成数组以及jquery的inArray方法的使用
for (var i=0, j = _self.sessionStorage.length; i < j; i++){ var key = _self.sessionStorage.key(i) ...
- 原生JavaScript常用本地浏览器存储方法五(LocalStorage+userData的一个浏览器兼容类)
基于LocalStorage+globalStorage+userData实现的一个本地存储类 userData用来兼容ie6 ie7 由userData模仿Session的方法:浏览器关闭删除保存的 ...
- 原生JavaScript常用本地浏览器存储方法四(HTML5 LocalStorage sessionStorage)
HTML5 LocalStorage浏览器的支持的情况如上图,IE在8.0的时候就支持了.不过需要注意的是,IE测试的时候需要服务器环境(或者localhost). 测试自然是检测浏览器是否支持本地存 ...
- 原生JavaScript常用本地浏览器存储方法一(方法类型)
有时需要将网页中的一些数据保存在浏览器端.好处就是当下次访问页面时,直接就可以从本地读取数据,不需要再次向服务器请求数据.目前常用的有以下几种方法: 1.cookie cookie会随着每次HTTP请 ...
- layui常见弹窗使用方法
1:confim类型使用方法 layui.use('layer', function(){ layer.confirm('是否立即上传卷宗信息?', { btn: ['是','否'], t ...
随机推荐
- Android 利用Settings.Global属性跨应用定义标志位
https://blog.csdn.net/ouzhuangzhuang/article/details/82258148 需求 需要在不同应用中定义一个标志位,这里介绍下系统级别的应用和非系统级别应 ...
- 数组实现堆栈——Java实现
1 package struct; 2 3 4 //接口 5 interface IArrayStack{ 6 //栈的容量 7 int length(); 8 //栈中元素个数(栈大小) 9 int ...
- Equinox OSGi服务器应用程序的配置步骤 (支持JSP页面)
本文介绍在Eclipse里如何配置一个简单的基于Eclipse Equinox OSGi实现的Web应用程序,在它的基础上可以构造更加复杂的应用,本文使用的是Eclipse 3.3.1版本,如果你的E ...
- 【Linux】【Services】【Package】编译安装
程序包编译安装: testapp-VERSION-release.src.rpm --> 安装后,使用rpmbuild命令制作成二进制格式的rpm包,而后再安装: ...
- Tableau如何绘制双柱折线组合图2
一.数据源准备 二.创建计算字段月度-拖拽至列-右键-精确日期 CASE[指标] WHEN "同期"then DATETRUNC('day',[日期])-5 WHEN " ...
- 【dva】model中effects函数的解析
结构 effects: { *pageQuery({ payload = {} }, { select, call, put }) { const res = yield call(pageQuery ...
- Firebug: Net Panel 使用详解
Introduction to Firebug: Net Panel Since there is not much user documentation related to Firebug fea ...
- 转:select、poll、epoll之间的区别总结[整理]
转:select.poll.epoll之间的区别总结[整理] select,poll,epoll都是IO多路复用的机制.I/O多路复用就通过一种机制,可以监视多个描述符,一旦某个描述符就绪(一般是读就 ...
- <转>C/S架构分析
系统架构师-基础到企业应用架构-客户端/服务器 开篇 上篇,我们介绍了,单机软件的架构,其实不管什么软件系统,都是为了解决实际中的一些问题,软件上为了更好的解决实际的问题才会产生,那么对于单机软 件的 ...
- ciscn_2019_s_9
很简单的一道题 例行检查 没有开启nx保护,就想到了shellcode来做 很明显的栈溢出 唯一的要求就是shellcode长度不能超过0x24 通过jump跳转到shellcode的位置 完整exp ...