Pular para o conteúdo principal

Ordenação no cliente

Aqui temos uma API que ordena com base no campo orderBy. Ao envolver nossa Collection em uma Query que ordena, podemos garantir que a ordem correta seja mantida após adicionar novos posts.

Nosso código de exemplo começa ordenando por title. Tente adicionar alguns posts e veja-os serem inseridos na ordem correta.

import { useSuspense } from '@data-client/react';
import { getPosts } from './getPosts';
import NewPost from './NewPost';

export default function PostList({ author }: Props) {
  const posts = useSuspense(getPosts, {
    author,
    orderBy: 'title',
    group: 'react',
  });
  return (
    <div>
      {posts.map(post => (
        <div key={post.pk()}>{post.title}</div>
      ))}
      <NewPost author={author} />
    </div>
  );
}
interface Props {
  author: string;
}
Resultado
Store▶