> 웹 프론트엔드 > 레이이 튜토리얼 > Layui의 로컬 저장 방법 소개

Layui의 로컬 저장 방법 소개

풀어 주다: 2019-12-20 17:12:35
앞으로
5330명이 탐색했습니다.

Layui의 로컬 저장 방법 소개

로컬 스토리지는 localStorage와 sessionStorage를 친숙하게 캡슐화하여 로컬 데이터를 더 쉽게 관리할 수 있도록 해줍니다.

localStorage 영구 저장소:layui.data(테이블,설정), 데이터는 물리적으로 삭제되지 않는 한 영구적으로 존재합니다.

sessionStorage 세션 저장 공간:layui.sessionData(table, settings), 페이지가 닫히면 무효화됩니다. 참고: Layui 2.2.5에는

이 추가되었습니다. 위의 두 가지 방법은 완전히 동일한 방식으로 사용됩니다. 매개변수 테이블은 테이블 이름이고, 설정은 키와 값을 설정하는 데 사용되는 객체입니다.

//【增】:向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 사용법 튜토리얼 컬럼을 주목해주세요.

위 내용은 Layui의 로컬 저장 방법 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:cnblogs.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿