Dexie.jsでよく使うコマンドまとめ
Dexie.jsでよく使うコマンドをまとめました。データベースの操作、テーブルの操作、テーブルからデータの取得、挿入、更新、絞り込みなど実際に使う際に最低限必要なコマンドだけをピックアップしてあります。
公開日:2020年1月10日
データベースの操作
データベースにテーブルを設定 ・初期化する
データベースにテーブルを設定 ・初期化する際は「version().stores()」を使います。
db.version(1).stores({
notes: 'fileName, noteTxt',
});
注意したいのは、この段階ではテーブルは作成されず待機している状態です。
また、一度作成したデータベースは、
- テーブルの追加
- テーブルの構造の変更
ができません。
テーブルの追加や変更をする場合は、バージョンを上げて対応します。
データベースに、同時に複数のバージョンが存在することはあり得ません。データベースが初めて作成されたときの初期バージョンはゼロです。データベースを作成した後は、versionchange トランザクションとして知られる特殊なタイプのトランザクションを使用しなければ、データベース (およびそのオブジェクト・ストア) に変更を加えることはできません。作成後のデータベースに変更を加えるには、現在のバージョン番号より大きいバージョン番号を指定してデータベースを開く必要があります。このアクションによって upgradeneeded イベントが起動されます。upgradeneeded イベント・ハンドラー内には、データベースまたはオブジェクトに変更を加えるためのコードが存在していなければなりません。
テーブルの変更と追加をする
すでにあるデータベースに、テーブルの追加 ・変更を行うときは、設定 ・初期化するの時と同じデータベースにテーブルを設定 ・初期化する際は「version().stores()」を使います。
使い方が違うのは、現行のバージョンと違うバージョンを指定するということだけです。
db.version(2).stores({
notes: 'fileName, noteTxt, Author',
});
注意が必要なのは、
- 他のDexieを使った関数も全てそのバージョン(この場合2)を読み込む設定に変更する
- すでに登録されているレコードには新しい設定(カラムの追加・削除、リネームなど)は反映されない
という点です。
データベースに接続する
IndexedDBのデータベースに接続します。
db.open();
上の「version().stores()」でテーブルが定義されている場合、定義データがIndexedDBに挿入されます。
データベースを削除する
データベースを削除します。
db.delete();
データベースを削除するので、アプリはデータベースとの接続を失います。
テーブルの操作
レコードの追加・更新
レコードの追加には2種類あります。
- table.add()
- table.put()
addは新規追加のみですでにレコードがあるときはエラーを返します。
putはなければ新規追加、あれば更新というRDBでupsertと同じ動きをします。
どちらも引数に連想配列でデータを渡します。
db.notes.add({fileName: 'test', noteTxt: 'test note', Author: 'me'});
db.notes.put({fileName: 'test', noteTxt: 'test note', Author: 'me'});
UPDATEにも対応しているので基本的にはputを使う感じかと思います。
レコードの削除
レコードの削除にはdelete()を使います。
db.notes.delete('test');
引数には、レコードのプライマリーキーの値を入れます。
テーブルの中身を空にする
RDBでいうtruncateと同じ動きをします。
db.notes.clear();
テーブルを新調する際や、ユーザーが自分のデータを削除したい時に使う感じでしょう。
テーブルからデータを取得する
キー指定で絞り込む
RDBでいうwhereと同じようなものをIndexedDBで使うためのメソッドがDexieに用意されています。
db.notes.where({fileName: test, Author: me});
whereメソッドは、同じTable系のorderByやlimitなどのメソッドと繋げて(チェーン)してデータの操作に使えます。
const result = db.notes.where({fileName: test, Author: me})
.orderBy('fileName')
取得したデータを操作する
IndexedDBからデータを取得したデータを、Dexieでは「Collection」と呼ばれています。
コレクションはこれ自体にメソッドを持っているため、「collection.メソッド名()」として、データの操作ができます。
件数を取得する
取得したデータ件数を取得します。
const count = result.count()
件数を制限する
RDBのlimitと同じです。
const count = result.limit(10)
offsetを指定する
データのスタート位置を指定します。RDBのoffsetと同じです。
const count = result.offset(10)
先ほどのlimitと組みわせることで、ページングができます。
const page = result.offset(10).limit(10) //10件目から10項目(2ページ目的な動き)
データをさらに絞り込む
RDBでいうOR句と似たような動きをします。
db.notes.where({Author: 'me'})
.or('fileName')
.startsWith('te')
どんなキーでも指定できるwhereと違って、or()の場合は、indexかpプライマリーキーしか指定できないので注意が必要です。
where句と組み合わせるメソッド
Dexieではwhere句と組み合わせるメソッドを「WhereClause」と読んでいます。
- above()
- aboveOrEqual()
- anyOf()
- anyOfIgnoreCase()
- below()
- belowOrEqual()
- between()
- equals()
- equalsIgnoreCase()
- inAnyRange()
- noneOf()
- notEqual()
- startsWith()
- startsWithAnyOf()
- startsWithIgnoreCase()
- startsWithAnyOfIgnoreCase()
これだけあればほとんどRDBと同じ感覚でデータの操作ができます。
簡単にですが、Dexieでよく使うコマンドまとめました。
ここに上げたものを使えば簡単なメモアプリくらいはサクッと作れてしまうくらい、IndexedDBを万能データベース化させてしまうのですから、Dexieは素晴らしいライブラリですね。
新着ノート
-
NUXT3
公開日:2023年2月16日
-
NUXT3
公開日:2023年1月30日
新着コード
-
Vue.js
公開日:2022年4月18日
-
Vue.js
公開日:2022年4月13日