跳到內容
+

資料網格 - 行釘選

釘選行以使其始終可見。

釘選(或凍結、鎖定或浮動)的行是指在使用者垂直滾動資料網格時始終可見的行。

您可以通過 pinnedRows 屬性傳遞釘選的行資料,將行釘選在資料網格的頂部或底部

const pinnedRows: GridPinnedRowsProp = {
  top: [{ id: 0, brand: 'Nike' }],
  bottom: [
    { id: 1, brand: 'Adidas' },
    { id: 2, brand: 'Puma' },
  ],
};

<DataGridPro pinnedRows={pinnedRows} />;

釘選行的資料格式與 rows 屬性相同(請參閱餵入資料)。

釘選行的資料也應符合行識別碼要求。

Enter 鍵開始編輯

控制釘選行

您可以通過更改 pinnedRows 來控制釘選哪些行。

在下面的示範中,我們使用 actions 欄類型添加按鈕,以將行釘選在頂部或底部,並動態更改 pinnedRows 屬性。

與其他功能一起使用

釘選行不受排序和篩選的影響。

分頁也不會影響釘選行 - 無論頁碼或頁面大小,它們都會保持釘選狀態。

API