【Angular】idをlocalStorageに保存

4073 ワード

前言
まずlocalStorageとは何か、なぜidをlocalStorageに格納するのかを紹介します.html 5のWebストレージから言えば、html 5はクライアントにデータを格納する新しい方法を2つ提供しています.
方法
区別する
localStorage
時間制限のないデータストレージは、翌日、第2週目、または1年後も使用できます.
sessionStorage
セッションのデータストレージでは、ユーザーがブラウザウィンドウを閉じると、データが削除されます.
以前は、これらはすべてクッキーによって行われていましたが、クッキーはサーバに対する要求ごとに伝達されるため、大量のデータの記憶に適していません.これにより、クッキーは速度が遅く、効率も高くありません.
一、localStorageアクセス値
localStorage.setItem("key","value");//      key,  value     

localStorage.key = "value"//      key,  value     

localStorage.getItem("key");//       key  123  

localStorage.key;//       key    

localStorage.removeItem("key")//      key      

二、sessionStorageとlocalStorageアクセス値の例
1.ローカルにデータを保存
  const info = {
        name: 'Jia',
        age: 18,
        id: '001'
    };
    sessionStorage.setItem('key', JSON.stringify(info));
    localStorage.setItem('key', JSON.stringify(info));

2.ローカルストレージからのデータ取得
var data1 = JSON.parse(sessionStorage.getItem('key'));
var data2 = JSON.parse(localStorage.getItem('key'));

3.ローカルストレージから保存したデータを削除する
 sessionStorage.removeItem('key');
 localStorage.removeItem('key');

4.保存したすべてのデータを削除
sessionStorage.clear();
localStorage.clear();

三、idをlocalStorageに記憶する.html
<div class="mui-slider-handle" (click)="gonext(item.classId)"> //   click        id,   classId
            <div>{{item.teachClassName}}
            div>
            <div>{{item.teachclassCode}}
            div>
            <div>{{item.teacherName}}
            div>
div>

2.ts
  gonext(classId) {
    //      id   localStorage 
    localStorage.setItem('classID', classId);
  }

まとめは1つの小さな毛皮しか知らず、勉強しなければならないことが多い.