SyncFusion DataGrid 列选择

Question

我使用 SyncFusion for React 的 DataGrid。他们有列的选择模式，但我找不到获取所选列的名称的方法。他们是否有返回所选列的方法？像他们的 getSelectedRecords() 方法一样？还是我需要自己想办法做？

我尝试使用他们的 getSelectedRecords() 方法，但只返回所选行的对象，甚至不返回所选单元格。

Answer 1

要获取所选列的字段名称，您应该首先使用“getSelectedColumnsUid”方法检索所选列的唯一标识符（UID）。此方法返回一个字符串数组，其中包含所选列的 UID 列表。然后，您可以利用这些 UID 通过“getColumnByUid”方法检索相应的列。获得该列后，您可以使用“field”属性访问字段名称。下面的代码片段演示了如何列出所选列的字段名称：

[index.js]

function DataGrid() {
let grid;
 
  function getSelectedColumnNames() {
    return grid
      .getSelectedColumnsUid()
      .map((uid) => grid.getColumnByUid(uid).field);
  }
 
  function btnClick() {
    console.log(getSelectedColumnNames());
  }
 
  return (
    <div className="control-pane">
      <div className="control-section">
        <button className="e-btn e-primary" onClick={btnClick}>
          Get Selected Column Names
        </button>
        <GridComponent
          ref={(g) => (grid = g)}
          dataSource={data}
          allowPaging={true}
          selectionSettings={{
            allowColumnSelection: true,
            type: 'Multiple',
          }}
        >
      .  .  .  .  .

示例：https://stackblitz.com/edit/react-grid-column-selection

API：

1. getSelectedColumnsUid：https://ej2.syncfusion.com/react/documentation/api/grid/#getselectedcolumnsuid
2. getColumnByUid：https://ej2.syncfusion.com/react/documentation/api/grid/#getcolumnbyuid