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

reactjs - Adazzle Grid OnEdit 更改单元格 Css

对于反应,是否可以更改组件的单元格颜色?我知道通过查看元素的 id/class 并执行 addClass 可以在 Jquery 中完成超级简单的操作,但是如何在反应时做到这一点?我仍在弄清楚变化,我能想到的是我在状态上设置了值,但是我如何获得受影响的单元格并实现状态?任何想法?或者有没有更好的网格可以实现,就像在 Jquery 中可以做的那样?

我使用的第三方网格 https://github.com/adazzle/react-data-grid

0 投票
1 回答
1612 浏览

javascript - 在 react.js 中创建动态列

我正在尝试在 react.js 中创建一个动态列,有人知道吗?我已经完成了静态列,但我想让它们动态查看我的代码,请给我建议。

0 投票
0 回答
56 浏览

javascript - react-data-grid jsfiddles不工作

我尝试了几个小时,但我无法让 react-data-grid 运行。必须告诉我,我是新来的反应!而且文档很差,这对我来说非常具有挑战性。

如果只有他们的 jsfiddles 可以工作。他们都没有!我从 2017 年底发现了一个线程,它要求同样的事情:如何在 jsfiddle 上运行 react-data-grid 示例?

但是接受的答案不起作用(不再)。你可以自己测试一下。如果我什至不能让它在 jsfiddle 上运行,我该怎么做。

有人可以帮忙吗?在我看来,它必须与相应的依赖版本有关,但我不确定。

谢谢你。

0 投票
2 回答
1592 浏览

reactjs - 如何从 react-data-grid 的列格式化程序组件调度操作

单击自定义格式的删除按钮时,我需要调度删除行条目的操作

0 投票
1 回答
1357 浏览

editor - 自定义编辑器反应数据网格

尝试创建自定义自动完成编辑器时遇到奇怪的问题。

基本上我所做的是我已经提取了内置的 AutocompleteEditor 类并将其重构为纯 ES6,并将该类重命名为 ProductSelectEditor。无需修改代码逻辑。

当我尝试使用它时,在调用 handleChange() 时出现错误“无法读取未定义的属性 'onCommit'”:

现在,如果我用真正的内置 AutocompleteEditor 替换编辑器,它就可以正常工作。我看不出任何直接的原因,为什么我的自定义版本不起作用,当我所做的只是将代码从 TypeScript 中重构出来,重命名类,并最终将类导出为默认值时?关于我在这里不理解的任何线索?

下面是整个重构代码

0 投票
3 回答
4105 浏览

reactjs - 如何在 react-data-grid 中隐藏列

我试图隐藏react-data-grid中的 'id' 列。我用

隐藏:真

在该列中,但它只隐藏行值而不是列。编辑行值以将其发送到响应时,我需要“id”。代码如下。

0 投票
1 回答
3086 浏览

reactjs - 如何在 react-data-grid 中创建自定义行渲染器

我试过这个在 react-data-grid 中呈现自定义行。但是如何为图像创建自定义行。我有两列名为 image_large 和 image_small。自定义行渲染器的代码如下:

0 投票
0 回答
124 浏览

javascript - 如何使用花括号中的参数访问反应函数中的事件?

我有一个函数“handleGridRowsUpdated”,我想在这个函数中访问事件。

我已经尝试以各种方式将事件传递给这个函数,也用谷歌搜索了它,但没有取得任何成功。

下面是代码片段:

我是新来的反应,任何帮助将不胜感激。

0 投票
1 回答
1574 浏览

react-data-grid - A checkbox data type and showing more than one row per "row" (in Adazzle react-data-grid)

We'd like to use React Data Grid from Adazzle (as mentioned in the tag with this question) now that we're using React (16.xx) and the older jsGrid is less appealing.

Two questions:

  1. Our old jsGrid had a data type to include in the grid called Checkbox. This was immensely helpful. I haven't found a similar type in the React Grid. Have I just missed it or is it not a part of the library?

  2. In each row, in some columns, we'd like to actually have two rows of data inside the column -- i.e., two lines of text separated by carriage return. But the react-data-grid demos only seem to show one line per column. Is this a limitation, or can we use CSS in the values inside columns?

  3. Is there search included for the rows shown in the table at any given point in time?

0 投票
0 回答
185 浏览

reactjs - 使用 connect 和 mapStateToProps 不提供更新的状态

我正在使用react-data-grid和 redux store 将用户输入的数据保存在网格/表格上​​。为了访问当前状态,我使用了 mapStateToProps 方法中的道具。但是 mapStateToProps 没有提供更新的状态。参考:第 151 到 156 行: https ://github.com/rupav/candis/blob/4bee19750b9449137ad85e99fdc38e1fdb52f996/candis/app/client/app/component/widget/DataEditor.jsx

第 151 行的props.row.update()更新了 redux-store ( rows value),这不会反映在 mapDispatchToProps Line num 的下一次调用中。156 . 虽然直接访问商店(没有连接),但为我提供了更新的状态:行号。154

我的 ReactDataGrid 组件设置为:

而 mapDispatchToProps 和 mapStateToProps 设置是: