IndexedDB + Dexie.js 初級編

■ 概要:

IndexedDB で、Dexie.js　ライブラリを使用した例となります
ブラウザ内のIndexedDB と、Vue-CLI を組み合わせて。
オフライン機能的な、仕組みを作れそうですので。試してみました

■ 環境

Vue CLI
dexie : 3.0.1
vue: 2.6.11
vue-router

■ 参考

https://developer.mozilla.org/ja/docs/Web/API/IndexedDB_API

https://dexie.org/

https://qiita.com/yamayamasan/items/a4297e724b86f4a00fd2

■ npm 追加

npm install --save dexie

■ 実装など

・db定義
db-name, store ,db-version
storeは、テーブルみたいな扱いのようです

var db = new Dexie("friend_database");
db.version(1).stores({
  friends: '++id, name, shoeSize',              
});

・追加

var item = {name: "Nicolas", shoeSize: 8}
db.friends.add( item )

・読み込み

async get_item(id){
   const data = await db.friends.get(id);
   console.log('data: ', data)       
}

・store に、読み、書き　できましたので
　DB設計や、実装方法を検討できるかと思います