Next.js에서 페이지 매김 또는 필터링 기능을 구현하는 방법을 알아보세요.

Question

저는 기존 페이지 라우팅 방법을 사용하여 웹 애플리케이션에서 페이징 또는 필터링을 구현하는 솔루션을 찾고 있습니다. 클라이언트 측 데이터 가져오기를 사용해야 합니까? 쿼리 문자열이 변경되면 페이지 콘텐츠가 다시 렌더링되지 않습니다. SSG를 사용하여 전체 데이터를 가져오고 클라이언트 측에서 페이지를 매기고 싶지 않습니다. 이를 효과적으로 달성하는 방법에 대한 조언이나 예를 제공해 주실 수 있나요? 현재 이 주제에 대한 리소스가 제한되어 있으므로 성능에 영향을 주지 않고 동적 데이터 변경을 처리할 수 있기를 바랍니다.

getServerSideProps에 쿼리 문자열을 전달하려고 시도했지만 새로 고칠 때만 데이터를 가져옵니다. 버튼을 클릭하면 페이지에 필터링되거나 페이지가 매겨진 콘텐츠가 즉시 표시되어야 합니다.

이에 대해 부정적인 댓글을 남기지 마세요. 더 많은 정보가 필요하시면 댓글로 질문해주세요.

Answer 1

이 문제를 해결했습니다. 궁금해하시는 분들을 위해 말씀드리자면 제가 실제로 실수를 했습니다. shallow: true放在了router.push里面。所以当我改变查询字符串时，我的页面没有重新渲染。当你改变查询字符串时，请确保在router.push里面放置shallow: false 넣었어요. 예는 다음과 같습니다.

으아악