Question

我将服务器端排序与ag-grid一起使用。到目前为止，我已将enableServerSideSorting属性设置为true。但是在版本升级后，此属性不可用。

我使用onSortChanged事件捕获网格的排序状态。我想在服务器端处理这种排序。因此，ag-grid仅按原始顺序显示来自服务器的数据。现在，我在网格外部对数据进行排序，然后再次按字母顺序对ag-grid进行排序。

我为此创建了一个示例。有两个组件属性setSortParams，它们在其中设置排序和数据，在其中获取已经排序的数据。

如何防止双重排序？

const ExternalGrid = ({ data, setSortParams }) => {
  const gridOptions = {
    columnDefs: [
      {
        headerName: "Quantity",
        field: "quantity",
        sortable: true
      }
    ],
    defaultColDef: {
      sortable: true
    }
  };

  const onSortChanged = params => {
    const sortModel = params.api.getSortModel();
    setSortParams([
      sortModel.length > 0,
      sortModel.length > 0 ? sortModel[0].sort === "desc" : false
    ]);
  };

  return (
    <div
      className="ag-theme-balham"
      style={{
        height: "180px",
        width: "300px"
      }}
    >
      <AgGridReact
        gridOptions={gridOptions}
        modules={AllCommunityModules}
        onSortChanged={onSortChanged}
        rowData={data}
      />
    </div>
  );
};

示例：https://codesandbox.io/s/ag-grid-server-side-sorting-chy7j

您可以在示例中看到，我在表格下显示了数据。我的目标是，无论我单击表头设置什么顺序，它在表中的顺序都相同。

Answer 1

使用服务器端行模型时，不应直接分配ScrolledFrame()（from sympy.geometry import Line3D, Point3D, intersection # Normalize direction vectors: def normalize(vector: list): length = (vector[0]**2 + vector[1]**2 + vector[2]**2)**0.5 vector = [i/length for i in vector] return vector # Example points for creating two lines which intersect at A A = Point3D(1, 1, 1) B = Point3D(0, 2, 1) l1 = Line3D(A, direction_ratio=[1, 0, 0]) l2 = Line3D(A, B) d1 = normalize(l1.direction_ratio) d2 = normalize(l2.direction_ratio) p = intersection(l1, l2)[0] # Point3D of intersection between the two lines bis1 = Line3D(p, direction_ratio=[d1[i]+d2[i] for i in range(3)]) bis2 = Line3D(p, direction_ratio=[d1[i]-d2[i] for i in range(3)])）。而是创建rowData。当您对任何列进行排序时，您将能够获取详细信息作为rowData={data}方法的参数。

您可以使用它向服务器提供排序信息。

参考：Implementing the Server-side Datasource

看看这个https://plnkr.co/edit/z8KzsZ8sAcCe9tYWJedS?p=preview。

在对列进行排序时，请注意您是通过ServerSideDatasource方法内的getRows获取详细信息的。

params.request.sortModel

Answer 2

如果在每个列定义中实现以下比较器，则网格在排序时不会修改行顺序：

columnDefs: [
  {
    headerName: "Quantity",
    field: "quantity",
    sortable: true,
    comparator: (valueA, valueB, nodeA, nodeB, isInverted) => 0
  }
],

https://codesandbox.io/s/ag-grid-server-side-sorting-fmmgf

使用基本模型在农业网格中禁用字母排序

2 个答案: