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://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設計や、実装方法を検討できるかと思います
ここから先は
26字
IndexedDB, Vue CLI 開発の事例、ノウハウに関する記事を集めました。 ■ 免責事項 / 注記 , 内容について動作確認…
期間限定!Amazon Payで支払うと抽選で
Amazonギフトカード5,000円分が当たる
Amazonギフトカード5,000円分が当たる
この記事が気に入ったらチップで応援してみませんか?