Skip to main content
Version: 3.xx.xx

sort-live-preview

localhost:3000
Live previews only work with the latest documentation.
import { useSelect, Select, Button } from "@pankod/refine-antd";

interface ICategory {
id: number;
title: string;
}

const PostCreate: React.FC = () => {
const [order, setOrder] = React.useState<"asc" | "desc">("asc");

const { selectProps } = useSelect<ICategory>({
resource: "categories",
sort: [
{
field: "title",
order,
}
]
});

return (
<>
<Select
placeholder={`Ordered Categories: ${order}`} style={{ width: 300 }}
{...selectProps}
/>
<Button onClick={() => setOrder(order === "asc" ? "desc" : "asc")}>Toggle Order</Button>
</>
);
};