Cursor-based Pagination

前回取得したidを保持しておいて、次回それを使用する

あるidでsortしておく必要がある

Primary Keyである必要はない

「次へ」のアクションしかないので。

pagingの途中でデータに追加削除があった場合にも飛ばない

そのデータが何かしらのidでsort出来る必要がある

特定のページへ遷移できない

「前へ」「次へ」の遷移しかできない

cursorが指しているデータが削除されると、pagingできなくなる

命名の例

cursor / limit

cursor / take

code:sql

SELECT *

FROM posts

WHERE id < ? -- cursorはid

LIMIT 10

ORDER BY id DESC

Prismaの例

1回目の呼び出し

https://gyazo.com/6e3f8b54019f40eb78e27308f011164e https://www.prisma.io/docs/concepts/components/prisma-client/pagination#cursor-based-pagination

code:1回目.ts

const results = await prisma.post.findMany({

take: 4,

where: { title: { contains: 'Prisma' } },

orderBy: {

id: 'asc',

},

})

const myCursor = results.at(-1).id // 結果の最後のcursorを保持しておく

2回目の呼び出し

https://gyazo.com/4fa714ef04374efbed92f5876459c443 https://www.prisma.io/docs/concepts/components/prisma-client/pagination#cursor-based-pagination

code:2回目以降.ts

const results = await prisma.post.findMany({

take: 4,

skip: 1, // 保存したcursorの次のものから取得する

cursor: {

id: myCursor,

},

where: { title: { contains: 'Prisma' } }

orderBy: {

id: 'asc',

},

})

const myCursor = results.at(-1).id

一発で書くと、

code:ts

const results = await prisma.fabric.findMany({

where: { ... },

take: limit,

...(cursor == null

? {}

: {

skip: 1,

cursor: {

id: cursor,

},

}),

orderBy: { id: 'asc' },

});

return {

items: results,

cursor: results.at(-1)?.id,

};

参考