reactjs - Ag Grid 防止列在排序过程中更改

标签 reactjs ag-grid ag-grid-react

我有以下列定义

<AgGridColumn headerName="Rank" cellRendererFramework={NodeIDRenderer} suppressFilter={true} suppressSorting={true} lockPosition/>

它使用的 Cell 渲染器是这个

import React from 'react';

class NodeIDRenderer extends React.Component {

  render() {

    return (
      <div>{Number(this.props.node.id) + 1}</div>
    );
  }
}

export default NodeIDRenderer;

我想做的是让此列成为对其他列进行排序时对其进行排名的一种方式。所以我希望此列始终从 1 开始,然后转到 N。我面临的问题是,当我对任何其他列进行排序时,此排名列也会发生变化。有没有办法“锁定”列,使数据永远不会移动?

最佳答案

使用node.rowIndex而不是node.id。 id 设置一次以维护对节点的唯一引用,索引在任何排序或过滤器上更新。我确实注意到过滤器对于行有一点不可靠的倾向,所以当过滤器更新时我调用了网格 api 的 refreshCells 函数。 Here is a plunker你可以用它来测试。

关于reactjs - Ag Grid 防止列在排序过程中更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49164018/

相关文章:

javascript - 在 Safari 上使用 React 的日期选择器

angularjs - Ag-grid 主详细信息防止详细信息行在数据刷新时关闭

ag-grid-react - 如何更改复选框颜色?股份公司网格

reactjs - 处理ag网格 react 并渲染复选框网格

ag-grid - 如何更改ag网格中选定行的颜色?

javascript - 创建一个封装耦合 React 组件的类,然后将该类设置为 React 状态?

reactjs - travis 无法构建,因为错误 : Cannot find module 'react-test-renderer/shallow'

javascript - 动态组件 onClick 不工作

css - Ag-Grid - 多行文本行

ag-grid - Ag Grid 自定义日期过滤器