정렬

헤더를 누르면 정렬되고, Shift를 누른 채 누르면 여러 컬럼 기준으로 정렬됩니다.
이 데모의 코드

import { createGrid } from '@freegridjs/core';
import { demoColumns, makeRows } from '../data';
import { button, tr, type DemoContext } from '../ui';

export default function mount(ctx: DemoContext) {
  const { lang } = ctx;
  const columns = demoColumns(lang).map(c =>
    // Custom comparator: sort names by last name, then first name.
    c.field === 'name'
      ? { ...c, comparator: (a: unknown, b: unknown) => {
          const [fa, la] = String(a).split(' ');
          const [fb, lb] = String(b).split(' ');
          return la.localeCompare(lb) || fa.localeCompare(fb);
        } }
      : c,
  );
  const grid = createGrid(ctx.host, { columns, data: makeRows(5000), locale: lang });

  grid.on('sortChange', e => ctx.log(`sortChange → ${JSON.stringify(e.sort)}`));

  button(ctx, tr(lang, { en: 'Country ↑ then Total ↓', ko: '국가 ↑ 다음 합계 ↓' }), () =>
    grid.setSort([{ colId: 'country', dir: 'asc' }, { colId: 'total', dir: 'desc' }]));
  button(ctx, tr(lang, { en: 'Name by last name', ko: '이름(성 기준)' }), () => grid.setSort([{ colId: 'name', dir: 'asc' }]));
  button(ctx, tr(lang, { en: 'Clear sort', ko: '정렬 해제' }), () => grid.setSort([]));
  return grid;
}