问题标签 [react-data-grid]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
4091 浏览

react-data-grid - 将行动态添加到 React-data-grid

我刚开始探索 React-data-grid,我注意到您必须设置 rowCount,这让我想知道是否可以动态添加更多行。我正在使用 websockets 来获取将作为行添加到表中的数据。如果不支持,这可能会成为交易杀手。

0 投票
0 回答
48 浏览

react-data-grid - 使用全局过滤器字段而不是每列过滤器

评估 React-data-grid,我看到过滤器示例在每一列上放置了一个过滤器字段。是否可以为整个表实现全局过滤字段?

演示 http://adazzle.github.io/react-data-grid/docs/examples/column-filtering

0 投票
1 回答
783 浏览

react-data-grid - React-data-grid 有处理分页的机制吗?

我在分页文档中没有看到任何内容。是否有内置机制,或者我必须自己实现它?

0 投票
2 回答
2426 浏览

reactjs - 类似于 Excel 的复制粘贴功能,用于使用 react 和网格库将数据添加到网格中

我正在使用前端的react、后端的Java和Postgres数据库创建一种excel 在线应用程序。我正在使用一个名为 ag-grid(社区版)的库。

现在我需要的功能之一是复制数据并将其粘贴到行中,就像我们在 excel 中所做的那样。

网格将与 Postgres 链接,数据库中表中的所有数据都显示到网格中,对网格所做的任何更改都将反映到数据库中,反之亦然。

具体需要是,我需要复制和粘贴功能,我需要粘贴数据,例如从其他 excel 复制到我的应用程序中。我应该能够创建空白行,并且我应该能够将数据粘贴到这些行中,如果空白行较少,那么一旦数据(例如多行数据),它的行应该自动添加(如在 excel 中)粘贴到一个或多个行中。当我选择保存我的应用程序时,网格的数据应该保存到数据库中。

  1. 是否可以使用 ag-grid community 创建此功能?
  2. 有没有为此目的推荐的其他图书馆?

如果有任何可用于此功能的资源或文档,请指出我。

0 投票
0 回答
146 浏览

reactjs - React-Data-Grid MultiSelect 过滤器

有人可以解释 setFilters 在这里做什么吗?我不明白它是如何声明的以及它在做什么。我正在尝试实现 react-data-grid。我可以过滤一列,但是当我选择另一列时,它会覆盖以前保存的过滤器选择。

如果有人有 setFilter 的示例,我将不胜感激。

0 投票
1 回答
1120 浏览

javascript - React 数据网格自定义编辑器与语义 ui 日历日期选择器 (dateinput) 一起使用

我试图为我的反应数据网格中的一行实现一个自定义编辑器,我希望让用户从日历输入而不是打字。我想出了一些不断返回无效日期的东西。

index.js


日期编辑器.js



如果有人有想法,我在这里也有我的代码实验React-Data-Grid Custom Editor at CodeSandBox 一些参考:语义 UI 日历React-Data-Grid 自定义编辑器非常感谢人们可能对我做错的地方有一些想法,真的欣赏。

0 投票
1 回答
201 浏览

reactjs - 更改MongoDB自然顺序,手动生成_id并按_id排序,在两行之间插入行实现(React Data Grid)

我正在开发一个类似 webApp 的 Excel,我想实现一个让用户自由插入行的功能。我可以轻松地修改前端以通过拼接和选定的行 id 来可视化插入的位置,但我们的后端使用的是默认生成 _id 和 order 的 mongoDB。为了解决这个问题,我们在之前和之后生成 Id,并在之前和之后之间生成 newId。

注意:insertIndex 初始未定义,选中单元格时设置状态,删除行后重置为未定义

但是,这个算法似乎有很多边缘情况没有考虑,有没有人有经验让它更健壮?或有关边缘情况的任何建议?

已知问题:

  • 选择行 [0] 时的错误行为
  • 生成 dup _id(不知道为什么)

其他想法

  • 如用户所见,通过 localStorage 渲染保存行状态而不是生成 _id 是否更容易。
  • 我在这里找到了这个输入链接描述但不明白,任何人都可以解释它是否可能的解决方案?

有什么想法吗?非常感谢

0 投票
1 回答
435 浏览

reactjs - 如何通过导出在非索引文件中渲染 react-data-grid?

我正在使用 react-data-grid 渲染数据,但它只在index.js文件中工作,但是当我在普通文件中使用时,我无法通过定义类和函数名来导出文件。

尝试使用类名和函数名导出。

需要导出文件以进行路由,需要从另一个文件中获取数据以在网格视图中发布以及用于搜索字段的过滤器功能。

0 投票
0 回答
1053 浏览

reactjs - 如何使用 react-data-grid 测试功能组件

我使用 React-data-grid (链接)创建了一个带有反应的数据网格

我的代码如下:

我是编写单元测试的新手,最近一直在编写非常基本的单元测试。我想知道使用 Jest/Enzyme 测试 onGridSort 方法的最佳方法是什么

在我的测试中,我目前有以下内容:

我想测试以确保网格的排序正确(按升序/降序排序)

0 投票
2 回答
642 浏览

reactjs - 如何向 React-Data-Grid 添加多个新列?

嗨,对于一个项目,我需要用户选择应该在 React 数据网格中显示的列。一些列可能是预设的,其他列可能会在以后添加。但是我尝试过,即使状态已相应设置并且没有显示错误,它也不会适用于多个添加的列

新列将由选择器选择。这将被添加到表类的状态中。如果尝试通过强制渲染方法的道具传递它,但它也没有多次更新列。我使用了不同/相同的键集。如果它是第一个新列,则将识别相同。我尝试调试它是否有任何理由将 nextColumns 归类为未更改,但它并没有让我更接近。

在 render() 中的 state.columns

组件调用

所以目标是根据状态创建所有列

如果需要更多代码,我很乐意提供

问候乔纳森