ReactJs с страницей Ant-Design открыт флажок, выбранный в таблице

Я создаю проект React с помощью Ant-Design. Когда страница открыта, я хочу, чтобы в таблице были выбраны несколько флажков.

Крюк:

  const [selectedPages, setSelectedPages] = useState([]);

Выбор строки:

  let rowSelectionPages = {
    selectedPages,
    onChange: onSelectPagesChange,
    selections: [Table.SELECTION_ALL, Table.SELECTION_NONE],
    getCheckboxProps: (record) => {
      return {
        disabled: record.screenName === 'Disabled',
        name: record.screenName,
        defaultChecked: record.key === 1
      };
    },
  };

onSelectPagesChange:

  let onSelectPagesChange = (newSelectedPages) => {
    setSelectedPages(newSelectedPages);
  };

Столбцы:

  let columnsPages = [
    {
      title: "screen name",
      dataIndex: "screenName",
      render: (text) => <a>{text}</a>,
    },
  ];

Мои данные:

  let dataPages = [
    {
      key: "1",
      screenName: "Home",
    },
    {
      key: "2",
      screenName: "Login",
    },
    {
      key: "3",
      screenName: "profile",
    },
    {
      key: "4",
      screenName: "Disabled",
    },
  ];

Стол:

<Table
            rowSelection = {{
              type: "checkbox",
              ...rowSelectionPages,
            }}
            columns = {columnsPages}
            dataSource = {dataPages}
          />

Я использую библиотеку Ant-Design впервые. Это код, который я пробовал. Но я не мог прийти к выводу.