ionic3: การใช้งาน localStorage

การเก็บข้อมูลของ localStorage เก็บในลักษณะของ key/value

  1. การเขียนและอ่านข้อมูลจาก localStorage
  2. การอ่านข้อมูลจาก localStorage โดยที่ยังไม่มี key นั้นอยู่
  3. การอ่านข้อมูลจาก localStorage ที่มี key นั้นเก็บอยู่
  4. การลบ localStorage โดยการกำหนด key

สร้างโปรเจ็กส์ใหม่ชื่อ localStorage

> ionic start localStorage blank
> cd localStorage 
> ionic serve

1. การเขียนและอ่านข้อมูลจาก localStorage

บรรทัดที่ 12: เขียนข้อมูลลง localStorage โดยมี key ชื่อ username
บรรทัดที่ 13: อ่านข้อมูลจาก localStorage ที่มี key ชื่อ username

2. การอ่านข้อมูลจาก localStorage โดยที่ยังไม่มี key นั้นอยู่

อ่าน username จาก localStorage
โดยที่ยังไม่ได้เก็บข้อมูล username ลง localStorage จะได้ค่า null กลับมา

ผลการรัน กด F12 ดู

username is null

3. การอ่านข้อมูลจาก localStorage ที่มี key นั้นเก็บอยู่

เพิ่มคำสั่งเขียนข้อมูล username ลง localStorage
อ่าน username จาก localStorage อีกครั้งคราวนี้จะได้ข้อมูลละ

ผลการรัน กด F12 ดู

username is jack

4. การลบ localStorage โดยการกำหนด key

บรรทัดที่ 13: ลบ localStorage item ด้วยคำสั่ง localStorage.removeItem()

ผลการรัน กด F12 ดู

username is null

Link