T
TanStack•3y ago
inland-turquoise

Initial sorting

Is it possible to initial sort by a column or more? In react-table v7 you did it like this 
const sortees = () => [
  {
    id: "firstName",
    desc: false
  },
  // other fields
];

useTable(
  {
    initialState: {
      sortBy: sortees,
    }
  },
  useSortBy,
);
const sortees = () => [
  {
    id: "firstName",
    desc: false
  },
  // other fields
];

useTable(
  {
    initialState: {
      sortBy: sortees,
    }
  },
  useSortBy,
);
but how do you do that in react-table v8?
1 Reply
inland-turquoise
inland-turquoiseOP•3y ago
the solution to my problem: 
  const [sorting, setSorting] = 
  // INITIAL SORT HERE
  useState<SortingState>([
    {
      id: "id",
      desc: false,
    },
  ]);
  const [globalFilter, setGlobalFilter] = useState("");

  const table = useReactTable({
    data: defaultData,
    columns,
    state: {
      globalFilter,
      sorting,
    },
    onSortingChange: setSorting,
    onGlobalFilterChange: setGlobalFilter,
    getCoreRowModel: getCoreRowModel(),
    getSortedRowModel: getSortedRowModel(),
    getFilteredRowModel: getFilteredRowModel(),
  });
  const [sorting, setSorting] = 
  // INITIAL SORT HERE
  useState<SortingState>([
    {
      id: "id",
      desc: false,
    },
  ]);
  const [globalFilter, setGlobalFilter] = useState("");

  const table = useReactTable({
    data: defaultData,
    columns,
    state: {
      globalFilter,
      sorting,
    },
    onSortingChange: setSorting,
    onGlobalFilterChange: setGlobalFilter,
    getCoreRowModel: getCoreRowModel(),
    getSortedRowModel: getSortedRowModel(),
    getFilteredRowModel: getFilteredRowModel(),
  });

Did you find this page helpful?