问题标签 [react-grid-layout]

我使用反应网格布局：https ://github.com/react-grid-layout/react-grid-layout

我不明白为什么我的表格中的列数没有通过网络浏览器更新。

事实上，this.props.cols.lg 不是 17 就是 24。

当它是 17 时，我的表正确显示。另一方面，当我选择一个有 24 列的时间段时，我的列从第 18 列开始依次排列。

this.props.cols.lg 设置为正确的值（17 或 24），但我的 HTML 页面没有更新到设计级别。

这是单行上的正确表格：

右表

如您所见，firefox web 控制台显示 react 属性与 17 一致：

和坏桌子

坏表

在这里，firefox web 控制台再次显示反应属性是正确的 (24)，但没有被 web 浏览器应用：

重要信息，

预先感谢您的帮助。

这是我的代码的一部分：

我正在使用react-grid-layout并创建一些可拖放且可调整大小的网格。

所以我能够做到这一点，并且工作正常。

我的 UI 就像我有两个选项卡，每个选项卡都有一些网格，所以当我从一个选项卡移到另外两个选项卡时，我正在显示该选项卡的网格。

我想要做什么

在更改布局时，我想将该布局存储到本地存储中，以便当我再次刷新或打开该选项卡时，网格的形成应该是我更改的那个。

所以按照图书馆中提到的，我正在使用这个

• 所以我正在做的是，当onLayoutChange我存储相对于我的布局时active_tab，当我从一个选项卡更改为另一个选项卡时，我正在检查本地存储并匹配哪个选项卡处于活动状态并获取该特定布局。
• 但这并没有发生，它只是采用了基本布局。

我做了什么

• 布局的onchange函数

编辑/更新

我已经更新了我的代码沙箱，因为之前它在控制台上采用布局，undefined现在它正在采用布局，这是更新后的代码沙箱

有什么方法可以在 react-grid-layout 中呈现自定义占位符（红色项目）？

例如，我想<img src...>在这个红色占位符中渲染一些。

我在官方文档（ https://github.com/react-grid-layout/react-grid-layout）中没有找到任何有关此的信息。

有小费吗？

我正在使用 react-grid-layout lib ，我想知道是否可以将 width 属性设置为“百分比”？喜欢：

我使用 React Grid Layout 库和 React Bootstrap 来处理项目以构建仪表板。如果我使用纯 html 定义的组件，我使用 React Grid Library 没有问题，但我想使用 React Bootstrap 来看看。

这是屏幕截图：

Bootstrap 代码非常基础

React Grid Layout 是否提供了一种方法来获取网格项的宽度和高度，以便下部组件设置大小？

我正在为我的项目制作页脚。我正在为页脚使用材质 UI 网格，所以我想在底部添加徽标，但我不明白为什么它有正确的填充（我猜它是填充，不确定）。

屏幕截图-> 是这样的。（出于隐私原因模糊了徽标）

Code Footer.js React 组件 ->

希望它看起来像这样->

当试图在我的 ResponsiveGridLayout 中拖动或调整任何面板的大小时，我收到以下错误：<DraggableCore> not mounted on DragStart!

这是我的网格布局：

这是每个单独的面板：

};

这是我对径向量规的反应代码。我将高度保持为 100%，但当我调整容器大小时，它仍然不会随之调整大小。我正在使用react-grid-layout包来创建可调整大小的小部件。

当我检查 DOM 时，它显示了这一点。我什至瞄准了 div 并添加了样式，但它仍然在 DOM 中显示 280px 和 208px，但在样式部分它显示 100%，但 Gauge 的高度没有改变。

当容器像这样调整大小但仪表仍然是相同大小时，还尝试了 Jquery 来调整大小。提前致谢 ！！

我有父组件（卡）。表格在卡片的主体中，但我想知道如何自动调整高度大小，使表格的主体占据卡片的整个主体。

注意：卡片可以取任意大小，用户可以调整卡片大小。该卡片是使用 react-grid-layout 的组件的一部分。

我是 react-grid-layout 的新手，我使用此示例创建了一个拖放示例示例https://react-grid-layout.github.io/react-grid-layout/examples/15-drag-from -outside.html。当项目被删除时，它总是放置在网格的第一列。警报中的 X 和 Y 是正确的，我的代码有什么问题？这是我的代码：