问题标签 [react-grid-layout]

这是react-grid-layout文档中的一段代码

有了这个，我想在 React 组件中提取div元素。所以我添加了这段代码：

所以第一部分变成：

问题是它不起作用，div元素存在但没有发生类名转换。

我错过了什么吗？

在过去的几个小时里，我一直在尝试寻找一种方法来使 React 组件可拖动和调整大小。我找到了一种通过反应拖放使其可拖动的方法 ，但我找不到使其可调整大小的简单方法：/ 有没有人对如何使组件可拖动和调整大小有任何经验？

任何帮助或指针表示赞赏！

当我遇到一些障碍时，我一直在尝试做出反应并正在研究 react-grid-layout。我基本上按原样粘贴了这里的示例，但由于某种原因，当我拖动一个元素时它没有粘住。我在控制台中遇到的错误是：

我确信这是我缺少的一件简单的事情，但这是我的第一个 React 项目，我希望能得到一些指导。

我的代码包括在下面：

在 React 中，我正在尝试使用https://github.com/STRML/react-grid-layout创建一个基本网格。

我创建了两个矩形，并为它们提供了这样的布局：

但是，显示的不是矩形，而是：

关于可能导致此失败的任何想法？

有没有办法以编程方式更改项目w的h布局？用例是有一个“折叠”按钮，它将高度降低到恒定高度，足以离开项目的标题。为此，我最初的想法是保持layouts组件的状态并手动将折叠项目的高度更改为另一个恒定高度。

但是，似乎该库将忽略layout初始渲染后的更改。是这种情况还是我的错误？如果这是正常行为，是否有另一种以编程方式改变高度的方法？

这是一个实现react-grid-layout. 这是两个“小部件”，它们有一个 onClick 处理程序来“折叠”它们。通过设置状态，它会触发重新渲染并重新计算布局，以便任何折叠的项目都具有降低的高度。控制台日志声明显示渲染的组件具有正确的新布局，但它没有反映在屏幕上，这让我相信还有另一个高度参考。

jsFiddle 示例

我正在使用 Meteor 和 ReactJS 开发一个应用程序。我正在使用react-grid-layout组件来创建项目网格。

问题是每个元素的位置需要手动指定。在我的应用程序中，我基于 Meteor Collection 生成网格项目，我可能不知道集合中有多少项目。

例子

在上面的示例中，网格每行应该有 4 列，但是我将如何指定x和y值，以便testCollection项目 1-4 在第 1 行，5-8 在第 2 行，9-10 在第 3 行，依此类推，无论集合中有多少项目。

非常感谢，感谢您的帮助。

我正在尝试为react-grid-layout*.d.ts提供一个文件。正如它的index.js文件所示，它导出了一个函数——被调用的子类：React.ComponentReactGridLayout

要求：

它还导出了一些其他东西，这些东西被分成了命名空间：

所以它会进行一次导出和多次导出。

我尝试了Typescript 站点上描述的Single Complex Object in Modules方法和GitHub 上的这个声明文件，但没有取得多大成功。

更新

现在忽略其他东西，我的定义ReactGridLayout如下：

哪个编译。但是它会生成如下 Javascript：

什么时候应该：

我正在使用react-grid-layout和react-custom-scrollbars创建面板网格。这是代码的简化版本：

除调整大小外按预期工作：Scrollbars仅在重新渲染时更新其条形图，这就是我设置该虚拟状态变量的原因forceRenderAfterResize。

实现这一目标的最佳方法是什么？上面的解决方案感觉有点笨拙，并且还会重新渲染所有项目，而不仅仅是调整大小的项目。

我正在尝试实施react-grid-layout. 所有示例都通过_griddiv 属性传递网格项配置：

在我的实现中：

我收到一个错误：

我对 React 还很陌生。我究竟做错了什么？

我使用的相关npm软件包版本：

如何覆盖 GridItem 的 onMouseDown？

我有这样的事情：

这会产生错误：

react-draggable.js：1050 Uncaught TypeError：无法读取未定义的属性“按钮”