我正在使用https://github.com/strml/react-grid-layout创建一个可以调整大小和移动的项目布局。我遇到的问题已在该存储库中的多个问题(下面)中提出,但几乎没有得到帮助。
这是我遇到的问题的基本复制。请参考以下链接:https://stackblitz.com/edit/react-rncnqr。谢谢!
- https://github.com/STRML/react-grid-layout/issues/806
- https://github.com/STRML/react-grid-layout/issues/299
<ResponsiveGridLayout
layouts={this.state.layouts}
autoSize={autosize}
breakpoints={breakpoints}
onLayoutChange={(layout, newLayout) =>
this.onLayoutChange(layout, newLayout)}>
<div key="1">...</div>
<div key="2">...</div>
<div key="3">...</div>
</ResponsiveGridLayout>
我希望能够在 <ResponsiveGridLayout>
中嵌套自定义组件,就像这样。其中<CustomComponent />
包含其他可以交互的框。
<ResponsiveGridLayout
layouts={this.state.layouts}
autoSize={autosize}
breakpoints={breakpoints}
onLayoutChange={(layout, newLayout) =>
this.onLayoutChange(layout, newLayout)}>
<div key="1">...</div>
<CustomComponent />
</ResponsiveGridLayout>
这是我遇到的问题的基本复制。请参考以下链接:https://stackblitz.com/edit/react-rncnqr。谢谢!