React NativeでmBaaSを使いやすくするReact Native SDKを非公式に開発しています。
NCMBMania/ncmb-react-native: NCMB SDK for React Native
これまでJavaScript SDKに似せる形で開発してきましたが、TypeScriptに沿った形で書くのに限界があったこと、React Native for Webでも使える形にしたかったので、バージョンアップすることにしました。これまでとは互換性はありませんが、より使いやすくなったはずです。
今回はデータストアをより使いこなすために重要なリレーションの使い方について解説します。
インストール
SDKのインストールはnpmで行います。
npm i ncmb-react-native
読み込み
import NCMB, { NCMBRelation } from 'ncmb-react-native';
読み込めるライブラリはほかにも下記があります。
- NCMBUser(会員管理)
- NCMBObject(データストア。保存、更新、削除)
- NCMBQuery(データストア。検索、取得)
- NCMBFile(ファイルストア)
- NCMBAcl(権限管理)
- NCMBRole(ロール、ユーザやロールのグルーピング)
- NCMBRequest(NCMBへのリクエスト用。通常は利用しません)
- NCMBRelation(データストアのリレーション)
- NCMBGeoPoint(位置情報�)
- NCMBInstallation(デバイストークン)
- NCMBPush(プッシュ通知)
初期化
SDKの初期化はアプリケーションキーとクライアントキーで行います。
const applicationKey = 'YOUR_APPLICATION_KEY'; const clientKey = 'YOUR_CLIENT_KEY'; new NCMB(applicationKey, clientKey);
新しいリレーションの作成
新しいリレーションを作成する際には、関連させるデータストアオブジェクトが必要です。以下の場合、Mainクラスのオブジェクトの中に、Testクラスのオブジェクトが関連付きます。
// 2つのオブジェクトを作成 const item1 = new NCMBObject('Test'); await item1.set('message', 'Hello, world from item1').save(); const item2 = new NCMBObject('Test'); await item2.set('message', 'Hello, world from item2').save(); // リレーションで関連づけ const relation = new NCMBRelation('Test'); relation .add(item1) .add(item2); // 関連づけを保存するデータストアオブジェクト const mainObj = new NCMBObject('Main'); // リレーションを保存 await mainObj .set('relation', relation) .save();
紐付いたデータの取得
データを取得する場合、Mainクラスからではなく、Testクラスから行うのがコツです。そして relatedTo
メソッドの中で、Mainクラスを指定します。
const query = new NCMBQuery('Test'); const ary = await query .relatedTo(mainObj, 'relation') .fetchAll();
リレーションからデータを削除
既存のリレーションからデータを削除する場合は、removeを使います。そして、そのリレーションデータを改めて保存してください。
const relation = new NCMBRelation('Test'); relation.remove(item1); await mainObj.set('relation', relation).save();
リレーションにデータを追加
追加する場合は、初回時と同じく add を使います。
const relation = new NCMBRelation('Test'); relation.add(item1); await mainObj.set('relation', relation).save();
注意点
既存のリレーションに対する add と remove は同時にはできません。
まとめ
React Native SDKはネイティブに依存する機能を除いて、すべての実装が完了しています。React Native(Webを含む)でサーバ機能が必要になりましたら、ぜひ使ってみてください。
リレーションはデータの関連づけを管理する上で便利な機能です。一対多となるデータを管理する際に役立ててください。