コレクション
コレクションは、繰り返しアイテムのリストです。UIコンポーネントエディタの右上隅にあるコレクションを作成ボタンを選択して、任意の個別コンポーネントからビジュアルにコレクションを作成できます。すべてのコレクションはコードとして生成され、リアルタイムサブスクリプションが自動的に設定されます。
データバインディング
Amplify Studioは、データモデル内のアイテムにコレクションをバインドする視覚的な方法を提供します。コレクションアイテムは、フィルタリング、ソート、またはコンテンツ管理ビューから特定のレコードにリンクできます。
GraphQLおよびDataStore
Amplify Studioは、すべてのAmplify GraphQL APIへのデータバインディングをサポートしています。DataStoreの有無を問わず対応しています。DataStoreと競合解決の詳細はこちら。
DataStoreなしのAPIの場合、いくつかのコレクション機能に制限があります：
さらに、データに関係がある場合、DataStoreなしのAPIではクエリの深さが4以上である必要があります。コードジェンのクエリ深さを更新するには：
- ターミナルでプロジェクトのルートディレクトリに移動します
amplify configure codegenを実行します- プロンプトが表示されたら、クエリの深さを4以上に設定します。その他のオプションはお好みで設定できます
amplify codegenを実行して、新しい深さでクエリを生成します
チュートリアル
- アプリのAmplify Studioを起動します
- コンポーネントからコレクションを作成します
- コレクションをデータモデルにリンクします
- フィルタを設定して、表示するデータをカスタマイズします
- ソート条件を設定して、データの表示方法をカスタマイズします
注： コンポーネントがデータモデルで裏付けられたプロパティを持たない場合、コンポーネントのプロパティを指定されたデータモデルフィールドに手動でマップする必要があります。
フィルタを設定
フィルタは、コレクションに表示されるレコードを制御します。単一のコレクションに複数のフィルタを追加できます。
ソート条件を設定
ソート条件は、コレクション内のレコードが表示される方向を制御します。
レイアウトの編集
Amplify UIの一部のコレクションプロパティをStudioで直接編集できます。レイアウトプロパティへの変更（リストとグリッド、方向、順序、パディングなど）はリアルタイムプレビューに反映されます。
検索とページネーションを設定
検索
コレクションは、左側のバーの含めるリンクを選択して、検索バーを自動的に含めるように設定できます。検索バーのプレースホルダーをカスタマイズして、ブラウザでテストできます。
ページネーション
コレクションは、ページごとに特定数のアイテムで自動的にページネーションするように設定できます。左側のバーの含めるを選択してページネーションを有効にしてアイテム数を設定します。
DataStoreなしのGraphQL APIにバインドされたコレクションの場合、ページネーションは制限されたサポートがあります。ユーザーはページを進めることができます（例：ページ1からページ2）が、ページをスキップすることはできません（例：ページ1からページ3）。