→ 直接的に前後のコンテンツを取得する仕組みは、現在のところありません。代替手段をご案内します。
直接的に前後のコンテンツを取得する仕組みは、現在のところありません。
代替の方法としては、コンテンツ一覧を全件取得した上で、判定する方法が考えられます。
代替手段
例えば、ブログにおいて、前後の記事へのリンクを表示させたいケースを考えます。
まずリンクの作成に必要な情報である、idとtitleを全件分取得します。
// 再帰処理で全件取得
const getAllContentsIDAndTitle = async (limit = 100, offset = 0) => {
const data = await client.get({
endpoint: 'blog',
queries: { limit: limit, offset: offset, fields: 'id,title' },
})
if (data.offset + data.limit < data.totalCount) {
const contents = await getAllContentsIDAndTitle(
data.limit,
data.offset + data.limit,
)
return [...data.contents, ...contents]
}
return data.contents
}
// 記事データの一覧を取得して格納
const contents = await getAllContentsIDAndTitle()
記事ページにて、自分自身のコンテンツIDから、前後のコンテンツを取得します。
(先頭や最後尾で前後が存在しない場合は、undefinedとなります。)
// 対象記事のコンテンツID
const slug = 'hoge2'
// 対象記事の配列のインデックス
const index = contents.findIndex((content) => content.id === slug)
// 前後のコンテンツIDとタイトル
const prev = contents[index - 1]
const next = contents[index + 1]
console.log({ prev, next })
// {
// prev: { id: 'hoge1', title: 'hoge1' },
// next: { id: 'hoge3', title: 'hoge3' }
// }
あとはコンテンツIDとタイトルの情報より、前後ページへのリンクを作成することができます。
個別のページにおいて、毎回同様のリクエストを行った場合、ビルド時間やデータ転送量が大きく増加する可能性があります。
一覧のデータを共通して利用できるものとなるため、一度取得したデータを再利用する構成をおすすめします。