问题标签 [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 回答
2374 浏览

reactjs - react-data-grid 中的多行标题

我想在我的标题中显示多行。

在此处输入图像描述

以前我可以更改标题高度

现在我想显示多行文本,最好作为数组传入。

我最接近的是通过一些论坛挖掘并遇到一个HeaderRenderer,它可以像这样添加到我的列中:

据我所见, HeaderRenderer 只接受一列,然后可以操作该列。

为了解决我的问题,这些解决方案之一就足够了:

  • 能够将组件添加到 Header 对象中
  • 可以选择在标题中添加多行文本
  • 允许代码解释换行符。IE。如果我当前添加“asdfasdf <br>asdfasdf”,那么它会按原样显示。
0 投票
3 回答
4892 浏览

reactjs - 如何展开/折叠行详细信息?

如何使用 react-data-grid 实现行详细信息和自定义详细信息组件的展开/折叠?

我有用户表,我希望能够在单击/双击用户行后查看用户详细信息。像这样的东西:http: //demos.telerik.com/kendo-ui/grid/detailtemplate。可以使用这个组件吗?

0 投票
0 回答
652 浏览

reactjs - 如何将 Redux-form 与 A​​ddazle react-data-grid 集成

Adazzle 数据网格中的网格如何嵌入到基于Redux-Form的反应组件中?

我有一个使用单元格编辑的数据网格。Adazzle 网格使用行的状态变量和一些访问器方法来呈现数据。它有一个用于更新行的处理程序。这是我采用的一种方法,用于将表单数据与网格中的更改同步。问题是在更改表单值后原始标志未设置为 false handleGridRowsUpdated

此外,这是我从 Redux-form 填充行的方式。基于 Redux-forms 的组件使用另一个包装 react-data-grid 的组件。

我也在考虑使用隐藏的表单控件,这可能只会让他更新到网格,以便只有来自网格的更改值被传递回服务器。

0 投票
1 回答
630 浏览

javascript - React-data-grid 作为 React 初学者

我的任务是创建一个看起来像这样的应用程序。作为一名 javascript 开发人员,我说这是一个学习的好机会ReactJS。我做了一些ReactJS教程,也有一些基本知识,npm但入门页面不是很健谈,我只是没有设法让它工作。

有人可以列出命令和说明如何在没有任何框架知识的情况下从头开始,所以npm start看起来像这样

例如

谢谢你。

0 投票
1 回答
1037 浏览

react-data-grid - React 数据网格并不总是在最后几列显示值

我的屏幕尺寸越小,没有值的列就越多。一旦我手动调整屏幕的宽度(通过将其拖得更大或更小),所有值都会显示出来。这似乎是一个错误。我附上了 2 张照片,显示了 html 如何在相邻单元格上显示值和没有显示值。

一个单元格显示值下一个不显示值| 在我拖动窗口大小之前

0 投票
0 回答
2016 浏览

javascript - 将排序和过滤结合到 React 数据网格中

帮助我理解过滤和排序。我使用一个示例的过滤另一个示例的排序

如果您执行以下操作:

  1. 对任何列进行排序
  2. 删除排序
  3. 为任何列添加过滤器
  4. 取下过滤器

如果您现在尝试对任何列进行排序,排序将不起作用。这是库中的错误吗?

0 投票
2 回答
3904 浏览

javascript - 在 React 数据网格中按日期排序

React 数据网格中是否有按日期排序?如果是这样,这怎么叫?在示例中,所有排序仅适用于该行:

示例 1

示例 2

在示例 2 中,有包含日期​​的列,但它们被排序为字符串。

0 投票
0 回答
1526 浏览

reactjs - 将 CheckboxEditor 与 react-data-grid 一起使用

我是 React 的新手,我正在尝试让 react-data-grid 显示其中一列的复选框。我已经导入了 react-data-grid 和 react-data-grid-addons 但我不确定如何将所需的道具传递给 CheckboxEditor。

从文档中假定“值”由“rowGetter”返回,但我如何将“key”和“onCellChange”道具传递给 CheckboxEditor,并且是从“this.state.viewColumns”获得的“rowIdx”。

任何示例或教程将不胜感激。

0 投票
1 回答
1669 浏览

react-data-grid - 如何在 React-Data-Grid 的单元格中显示布尔值?

非常简单的问题,我想在我的 react-data-grid 中显示布尔值。老实说,我不在乎它是如何显示的:复选框、收音机、文本……我只是希望它出现以便我可以编辑它。

我宁愿不将我的数据转换为所有字符串,然后必须将它们重新转换回来,但这可能是唯一的方法。

这是一个刚刚关闭的相关问题:https ://github.com/adazzle/react-data-grid/issues/722

还有一个类似的问题:使用 CheckboxEditor with react-data-grid昨天问过并且完全沉默。

有没有人有办法在 React-Data-Grid 中显示和编辑布尔值,或者我应该在别处寻找。

0 投票
0 回答
416 浏览

javascript - 在 react-data-grid 的单元格中使用换行符制作多行

我正在使用 react-data-grid 来编辑数据。某些数据太长而无法在单元格中显示。但是,我不知道如何制作长数据多行。此外,我的数据有像 ↵ 这样的换行符,但我认为 react-data-grid 忽略了这一点,因此在单元格的一行中显示数据。

我希望在 react-data-grid 的单元格中找到带有换行符的多行数据