我对React和TypeScript都是新手，我正在尝试基于它们的简单示例创建一个简单的React数据网格：
这就是我所拥有的：
import React from 'react';
import ReactDataGrid from 'react-data-grid';
const columns = [
{ key: "id", name: "ID", editable: true },
{ key: "title", name: "Title", editable: true
浏览 6提问于2020-02-28得票数 0
回答已采纳
我正在尝试在react-data-grid中实现DnD功能，但我得到的是"TypeError: Object(...) is not a function" Error。 在TypeSript中有一个与我在沙箱中提供的文件相同的文件(它仅供参考)。我正在尝试实现React中的功能，但在将TS代码转换为React代码时出现了一些错误。我使用的是react-data-grid ^7.0.0-canary.33。 <DndProvider backend={HTML5Backend}>
浏览 38提问于2021-01-08得票数 1
回答已采纳
1回答
我想分叉的回购在吉突，作出一些改变，并安装在我的反应应用程序。
我在repo的package.json中添加了名称、版本和描述属性
我尝试通过npm安装用户名/repo_url#分支来安装它。
它确实安装和构建了包，但是忽略了节点_模块/react grid/packages/*/中的dist和lib文件夹，而且我无法在代码中导入它。
我试过了
1)在我的应用程序的.gitignore中注释dist
2)在我的应用程序的package.json中使用dist添加文件属性
毫无办法。我做错了什么？
编辑
下面是@Derek响应之后的堆栈跟踪
npm install piby180/react-d
浏览 1提问于2019-07-12得票数 1
尝试在这里使用react-data-tables，并在左侧、右侧和中心出现错误。快要疯了。
按照的说明并使用来自的代码示例后，我遇到了以下问题。
如果我在我的文件中使用这个
import React from 'react';
import ReactDOM from 'react-dom';
import ReactDataGrid from 'react-data-grid';
import ReactDataGridPlugins from 'react-data-grid/addons';
var Toolbar = R
浏览 4提问于2016-07-29得票数 1
当react-data-grid中的"select all“复选框被选中时，我想编写一些自定义逻辑。那么，当用户单击"select all“复选框时，如何获得该复选框句柄呢？
下面是指向一些react-data-grid示例的链接和指向存储库的链接
在我的render()中，我定义了react-data-grid，如下所示。
呈现该表时，它看起来像这样的
let dataGrid = <ReactDataGrid
ref={node => this.grid = node}
onGridSort={this.handl
浏览 0提问于2018-08-24得票数 0
在React-Data-Grid回购中，我看到了
export interface DataGridProps {
columns: ColumnList;
(...)
rowRenderer?: React.ReactElement | React.ComponentType;
rowGroupRenderer?: React.ComponentType;
(...)
和
export default class ReactDataGrid extends React.Component<DataGridProps, DataGridState> { ...
浏览 1提问于2019-07-09得票数 1
1回答
我在我的应用程序中使用了几次React ()。我注意到有一个控制台警告道具“未定义”，即使只使用最低要求的道具也会打印。
最小的，可复制的例子
安装RDG
$ npm install react-data-grid --save
或与纱线：
$ yarn add react-data-grid
file.tsx
import React from 'react';
import ReactDataGrid from 'react-data-grid';
const columns = [
{ key: 'id', name: 'ID
浏览 1提问于2019-06-07得票数 1
我正在尝试用我自己的数据创建一个带有react- data -grid的数据表。首先，我尝试重新创建入门示例，得到以下错误 "TypeError: Cannot read property 'map' of undefined" at
.../node_modules/react-data-grid/dist/react-data-grid.js:1094. 我正确地安装了所有的东西，我不确定为什么会发生这种情况，而我只是按照教程的字面意思去做。 最初从我自己的数据开始，然后我使用了与示例中相同的数据，它仍然有相同的错误。 通过此链接使用教程：https:
浏览 9提问于2019-07-04得票数 1
回答已采纳
我正在尝试使用React-Data-Grid和"react-data-grid-addons“创建带有过滤列选项的动态表。我刚刚在我的组件中导入了这两个插件，导入grid-add-ons会导致代码失败，错误如下。请协助或是否有任何其他选项来创建带有筛选器的表
import ReactDataGrid from "react-data-grid";
import { Toolbar, Data, Filters } from "react-data-grid-addons"; //Writing this only fails the code
./no
浏览 7提问于2020-05-09得票数 3
)我在我的应用程序中使用了几次React ()。我注意到有一个道具"enableRowSelect“的控制台警告，它会打印您是否使用上述道具。
控制台警告：
enableRowSelect已被废弃，并将在将来的版本中删除。请改用rowSelection
最小的，可复制的例子
安装RDG
$ npm install react-data-grid --save
或与纱线：
$ yarn add react-data-grid
file.tsx
import React from 'react';
import ReactDataGrid from 'rea
浏览 2提问于2019-06-05得票数 3
1回答
我是当今技术的新手，但我正计划在一个宠物项目中使用react-data-grid。
我有点醉醺醺地试图理解git，npm，react，react-data-grid，babel，webpack，javascript及其变体.所以我想我应该试着用Facebook上的create-react-app开发我的第一个简单的create-react-app应用程序。
在呈现过程中，我会遇到以下失败，并且我被困住了：
'WEBPACK_IMPORTED_MODULE__react"React".createElement')：未定义不是对象(求值TypeError)
浏览 1提问于2018-01-25得票数 0
回答已采纳
1回答
响应数据网格x轴滚动不工作在浏览器(crome)，我的当前(70.0.3538.77)版本(克罗姆)，但在以前的版本(69.*)。但是和其他浏览器工作的很好。我的React版本是"react"："16.4.1"，React-data-grid版本是“react data-grid”："4.0.8"，"react-data-grid-addons"："4.0.8“。
浏览 0提问于2018-11-03得票数 1
回答已采纳
示例:在Modal中弹出的表格当我们点击搜索按钮时，java应用程序中有一个现有的功能，它将弹出一个模态窗口(如数据表格网格)，并以表格格式显示数据，并提供过滤和排序选项，当我们从表格中选择记录时，它将在现有的表单中被选中。如何使用ReactJs和react-bootstrap实现这一点？是否有库可以导入并满足此要求？过滤，排序下拉列表...
Col1 Col2 Col3 +添加行
选择此行时..Col1 Col2 Col3 -Del行
好的。选中该行后，值将显示在主窗体中
浏览 15提问于2017-02-03得票数 0
我目前正在使用react-data-grid，而且我已经差不多完成了……我在工具栏中显示了filters按钮。我需要另一个按钮来影响表中所有选定的项，我想将其添加到工具栏的左侧，以节省空间。有没有人知道用react-data-grid做这件事的方法？
我查看了github中的代码，我看到了Toolbar项，它似乎非常特定于react-data-grid，但也有AdvancedToolbar项，我不确定它是否可以用于将您自己的自定义项添加到react-data-grid中。
在react-data-grid示例中没有任何添加自定义按钮或组件的示例，但我想知道是否有人做过这样的事情，并且可以分享一
浏览 27提问于2016-07-29得票数 2
4回答
我有一个关于ReactDataGrid组件的问题。我已经安装了react-data-grid。代码与reac grid的web中的代码相同：
const columns = [
{ key: 'id', name: 'ID' },
{ key: 'title', name: 'Title' },
{ key: 'count', name: 'Count' }];
const rows = [{ id: 0, title: 'row1', count: 20 }, { i
浏览 26提问于2020-02-14得票数 2
Visual studio 2017版本在构建时抛出错误
src\Service\node_modules\utility-types\dist\aliases-and-guards.d.ts(10,51): Error TS2304: Build:Cannot find name 'bigint
这只在管道上观察到，在本地它工作得很好。
我做了我的家庭作业，并将我的typescript从3.1升级到3.7，但是VS任务仍然无法理解，并在构建时抛出错误。
它在azure流水线中运行，因此任务和整个流水线都会失败。
tsconfig
{ "compilerOptions&
浏览 6提问于2020-02-11得票数 0
回答已采纳
1回答
我查看了react-data-grid源代码，并注意到这一行：
return x - this.cell.current!.getBoundingClientRect().left;
我好像弄不明白到底是什么东西！正在做什么。
浏览 0提问于2019-12-19得票数 0
1回答
我最近安装了react数据网格组件，并开始尝试测试它。它应该从文档中运行，但是我得到了一个我不理解的编译错误。我会感谢你的帮助。谢谢。
下面是错误。我得到了
./node_modules/react-data-grid/lib/DataGrid.js 102:37
Module parse failed: Unexpected token (102:37)
File was processed with these loaders:
* ./node_modules/babel-loader/lib/index.js
You may need an additional loader to
浏览 2提问于2020-07-07得票数 3
使用React+Typescript，我需要在表格上实现上下文菜单，点击行单元格和列标题。
我看了几个库: ag grid在企业版中提供了上下文菜单，它只在行单元格上。react-data-grid提供了行级上下文菜单。但是这个库的文档维护性很差，给开发带来了困难
有没有人可以建议我如何做到这一点？
浏览 1提问于2020-06-15得票数 1
我是个新手。昨天才开始学习。我想在react应用程序中实现数据网格，所以决定使用ReactDataGrid组件。我使用命令npm install react-data-grid --save安装组件网。这就是我在页面中实现代码的方式。 import { Component } from 'react';
import ReactDataGrid from 'react-data-grid';
class Employee extends Component {
constructor(pros) {
super(pros);
浏览 30提问于2020-11-08得票数 1
回答已采纳
1回答
我在这里遵循教程：http://adazzle.github.io/react-data-grid/docs/examples/column-sorting并尝试实现react-data-grid，因为它为我提供了进行排序、特定单元格的树型视图等功能。但我收到了如下错误： 不变冲突:钩子只能在函数组件的主体内调用。 import React from "react";
import { useState } from "react";
import ReactDOM from "react-dom";
import ReactDataGrid
浏览 21提问于2019-04-20得票数 0
因此，我正在使用由yo sharepoint生成器版本1.13.1生成的OOB项目，并使用react router 6.2.1和类型记录版本4.5.4。
每次我做一次一次性的构建时，tsc就会抛出这个error....did，有人能做到这一点吗？
16:04:24错误- tsc节点_模块/react路由器/index.d.ts(151，74)：Error TS1110:类型预期。16:04:24 Error - tsc节点模块/react路由器/index.d.ts(151，83)：error TS1005：'}‘预期。16:04:24 Error - tsc节点_模块/react路由
浏览 8提问于2022-01-18得票数 0
我刚刚开始探索React-data-grid，我注意到您必须设置rowCount，这让我想知道是否可以动态添加更多行。我使用websockets来获取数据，这些数据将作为行添加到表中。如果不支持，这可能是一个交易杀手。
浏览 11提问于2019-02-28得票数 0
回答已采纳
我正在尝试为customRowRendered编写一个reactDataGrid，但它不是很好的整数。
import React, { Component } from "react"
import ReactDOM from "react-dom";
import PropTypes from 'prop-types';
import ReactDataGrid from 'react-data-grid'
const RowRenderer = ({ renderBaseRow, ...props }) => {
浏览 2提问于2020-07-27得票数 0
我正在加载一个react- data -grid，其中包含一个逐行填充的数据源(每秒添加一次行)。一旦它达到9行，它就会停止添加行。我还有另一个问题，在我改变屏幕上的缩放比例之前，网格不会显示出来。事先为空。这是我的网格元素 import React, { Component } from 'react';
import DataGrid from 'react-data-grid';
import 'react-data-grid/dist/react-data-grid.css';
const columns = [
{ key: &
浏览 16提问于2020-03-27得票数 1
因此，我正在尝试使用react-data-grid，但我在单元格编辑方面遇到了问题。我要做的是编辑一个单元格，然后更新单元格以显示新值。我尝试了React数据网格网站上的所有示例，但似乎没有一个有效。我可以编辑该单元格，但如果我单击另一个单元格或按enter键，该单元格将返回到其旧值。我不知道为什么，但是onGridRowsUpdated从来不会开的！我希望有人能帮我解决这个问题，下面是我的代码： import React, { Component } from "react";
import ReactDataGrid from "react-data-grid&#
浏览 13提问于2020-04-05得票数 1
我正在尝试将react数据网格与电子js集成，在使用"useState“时我遇到了一些问题。控制台要求我添加错误边界，但添加也没有帮助。我在stackoverflow中搜索了类似的问题，并确保react升级到了使用钩子的最新版本，并且与react-dom相同。但是，即使遵循了上面的步骤，我也不能让它工作。
我正在尝试使用react-data-grid documentation 中的高级过滤选项
但唯一的区别是我尝试在电子js上使用react-data-grid。由于我是javascript的新手，我不确定我错在哪里。
存储库链接：
错误的屏幕截图：
任何建议或帮助，我们将不胜感激。
浏览 2提问于2018-12-17得票数 0
1回答
我正在参与一个相当大的React项目，该项目使用react-data-grid显示大量可编辑的数据。现在，您必须单击Update按钮将更改发送到服务器。我手头的任务是创建这样的自动保存功能：
用户选择单元格来编辑文本。
用户更改文本
用户要么移动到另一个单元格，要么单击远离数据网格。
更改将持久化到服务器。
以下是我尝试过的：
每个列上的onBlur事件。事件将触发，但事件似乎附加到div而不是底层的input控件上。因此，在触发此事件时，我无法访问该单元格的值。
onCellDeselected在<ReactDataGrid>组件本身上。该方法似乎
浏览 5提问于2016-11-30得票数 2
2回答
几天前，我试图在我的“反应”应用程序中添加“故事本”( Storybook )，基本上所有东西都崩溃了。我是从备份中恢复的，但是它没有包含node_modules文件夹，并且'npm‘没有将事情恢复到原来的状态。现在，我从片段的类型记录中得到了这个错误：
ERROR in src/components/customTable/customTableHeader.tsx:83:12
TS2746: This JSX tag's 'children' prop expects a single child of type 'ReactNode',
浏览 6提问于2022-04-28得票数 0
react-data-grid对每个单元格都有默认的工具提示。它会自动添加title属性。我不想要那个工具提示，我怎么隐藏它？ 另外，我不想使用custom formatter。我想它会在头顶上。 例如Try to hover on any cell 在此处查看Kristin上不需要的工具提示 ?
浏览 17提问于2019-02-08得票数 1
我运行的代码是：
import React from "react";
import ReactDataGrid from "react-data-grid";
const styles = {
fontFamily: "sans-serif",
textAlign: "center"};
const Example = () => {
const columns = [
{ key: "id", name: "ID" },
{ key: "t
浏览 0提问于2020-11-15得票数 1
回答已采纳
我已经将react-data-grid集成到了我的一个项目中。在那里，我想根据加载的行来设置网格的动态高度。我该怎么做呢？
浏览 0提问于2019-09-04得票数 4
我想扩展一个反应道具的接口。但我得到TS错误错误：(19，35) TS2304:无法找到名称'T'.
1)为什么出错？<T>是泛型类型。它不能在使用前声明。
2)为什么TS在我的代码中抛出错误，而不抛出。泛型类型<T>和许多其他类型在代码中随处可见。他们为什么不扔？
( 3)如何正确地扩展它？
这是我的密码。
我从导入接口道具
import React, {Props, PureComponent} from 'react';
// TS throws Error:(20, 27) TS2304: Cannot find name &#
浏览 1提问于2019-07-01得票数 21
3回答
如何使用react-data-grid实现行明细和自定义明细组件的展开/折叠？
我有用户表，我希望在单击/双击用户行后能够看到用户详细信息。类似这样的东西：。可以使用这个组件吗？
浏览 1提问于2017-06-09得票数 1
我正在开发一个使用的react应用程序。通过webpack服务资产，通过npm管理依赖关系。
我想对localhost上的react-data-grid进行修改，并让这些更改出现在我现有的项目中。
做这件事最好的方法是什么？
浏览 0提问于2015-11-18得票数 1
以下是我用于react-data-grid的版本。在Chrome上运行应用程序。
"react": "^15.4.2",
"react-data-grid": "^2.0.8",
"react-data-grid-addons": "^2.0.17",
我正在从主网站复制示例。网格本身正在按预期运行，但我在Chrome的控制台中收到以下警告：
Warning: Failed prop type: Invalid prop `options[0]` supplied to `DropDownEdito
浏览 1提问于2017-03-03得票数 1
我正在使用react-data-grid。当我在mobile中加载网格时，冻结的列在水平滚动中闪烁。这是重现错误的链接。
。
只需在移动视图中加载网格并尝试水平滚动即可。
任何以前遇到过这个问题的人，请给出一些解决方案
浏览 0提问于2017-09-14得票数 1
嗨，伙计们，我试着在webpack中把和addons库设置为外部函数，这样他们就不会被包含在我的资产捆绑中。在我试图把它转移到webpack的外部部分之前，我已经把一切都做好了。我在一些堆栈跟踪中发现了以下错误消息，但无法使其正常工作。也许我的用例有点不同，问题就在别的地方？这是我得到的信息：
React.createElement: type无效--需要一个字符串(用于内置组件)或类/函数(用于组合组件)，但是got: object。检查Table的呈现方法。
我在我的package.json中使用了以下版本：
"dependencies": {
"r
浏览 2提问于2017-11-16得票数 1
目标:目前使用react数据网格，我希望使用日期选择器(自定义编辑器)将用户输入保持在统一的MM/DD/YYYY中，并在用户浏览器区域设置(自定义格式化程序)中进行格式化，是否可以实现。 (如果我以日期选择器格式进行转换，可能需要修改后端。) 我为这篇文章做了一些研究，Using react-datepicker in react-data-grid compoent，格式化程序不能和编辑器一起工作吗？ 这是我构建的演示：https://codesandbox.io/embed/8l4jkor19 到目前为止，我还不能让格式化程序工作。 class DateFormatter extends
浏览 14提问于2019-04-05得票数 1
回答已采纳
2回答
因此，我几乎可以肯定做错了什么，并且不理解这里的底层库，但是我如何才能将行项目从外部更新到React-Data-Grid呢？ 下面的例子，在5秒后，第一行的第一列被更新，但表中的数据没有更新。为什么？该如何改变呢？ let cols = [
{
key: 'sapAssetNumber',
name: 'SAP Asset number',
editable: false
},
{
key: 'assetDescription',
name: 'Description',
浏览 25提问于2019-05-10得票数 0
回答已采纳
我正在使用CustomTransformer从以下位置更新导入： import { global_spacer_form_element } from '@patternfly/react-tokens';
export const disabledLabelClassNameEx = global_spacer_form_element.var; 至 import global_spacer_form_element from '@patternfly/react-tokens/dist/js/global_spacer_form_element';
exp
浏览 93提问于2021-02-12得票数 1
回答已采纳
1回答
我正在尝试使用ag-grid的新react-ui，但是它显示模块不存在。https://www.ag-grid.com/react-data-grid/reactui/ import { AgGridReact } from '@ag-grid-community/react'; 错误： Failed to compile.
./src/features/ppc/landingPage.jsx
Module not found: Can't resolve '@ag-grid-community/react' 我换成了 import { AgGrid
浏览 67提问于2021-10-21得票数 0
我正在研究一个概念样例React框架/库，它可以用于React应用程序，以及一个AngularJS框架包装器，这样它也可以作为AngularJS框架/库使用。
有两个项目：
样品反应框架
示例反应框架包装器( AngularJS项目)
现在，我有一个从示例反应框架包装项目到样例反应框架项目的npm链接。
示例反应框架有3个组件-导航栏、横幅和侧菜单.这些组件是.jsx文件。
样例-反应-框架包装也有3个组件-相同的3个-只是.ts包装器，以呈现反应元素。
我正在尝试将我的React模块导入到TypeScript模块中，它似乎正在工作，但最终还是会抛出一个错误：
webpack result i
浏览 9提问于2015-10-01得票数 1
回答已采纳
我正在使用react-data-grid &为某一列制作了一个自定义菜单组件，因为我无法获取网格高度的顶部，以定位我的网格我尝试对值进行硬编码，但它失去了响应性。
我把grid-component放在一个div中，通过Id来定位它。
在react的世界里，这是一种正确的方法吗？
有没有更好的方法来抓住网格的顶部？？
浏览 2提问于2020-02-26得票数 0
我尝试使用在react-data-grid中呈现自定义行。但是如何为图像创建自定义行呢？我有两个列，分别名为image_large和image_small。自定义行渲染器的代码如下：
<div className="row" style={{minHeight: 300, margin: 20}}>
<div className="col-md-6">
<img onClick={() => this.button()}
src=
浏览 0提问于2018-07-10得票数 2
回答已采纳
如何设置使用react-data-grid创建的最终表的大小。
例如，如果我想要一个250*250像素大小的表格，该怎么做呢？
有没有什么道具可以做到这一点呢？或者需要使用纯CSS来完成。
Saurav提供的解决方案之后
浏览 4提问于2020-07-02得票数 0
10回答
构建应用程序后，响应路由器不工作
、、、、
我是新的反应和反应-路由器。该应用程序是使用创建的。我需要用两个主页面在我的应用程序中实现路由。我尝试了许多选项，并最终使它与以下代码一起工作。
此代码在开发过程中运行良好。但是在构建了这个应用程序之后，它就不能正常工作了。只显示到404页的路由。请帮我解决这个问题。
<Router history={browserHistory}>
<Route component={Root}>
<IndexRoute component={App} />
<Route path="/" component={App} />
浏览 23提问于2017-04-10得票数 27
回答已采纳
我正在尝试使用react-data-grid在我的网站上创建一个表，并得到未定义长度的错误。我还有另外两个列和行文件，我将它们包含在状态中。
<ReactDataGrid
columns={this.state.columns}
rowGetter={i => this.state.rows[i]}
rowsCount={this.state.rows.length}
onGridRowsUpdated={this.onGridRowsUpdated}
enableCellSelect={true}
/>
浏览 5提问于2020-11-16得票数 1
3回答
我们正在使用react-data-grid (adazzle)，并且希望对表头进行一些样式调整。
我们希望调整标题，使其大约是表中行高度的两倍，如下所示：
我猜我们将通过HeaderRow组件来处理这个问题。但是，由于这个组件没有文档，所以我不知道如何进一步解决这个问题。
浏览 1提问于2017-05-22得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
