React-grid-layout: Cannot read property 'onLayoutChange' of undefined

Created on 13 Feb 2018  路  4Comments  路  Source: STRML/react-grid-layout

Thanks for submitting an issue to RGL!

Please mark the type of this issue:

  • [x ] Bug
  • [ ] Feature Request
  • [ ] Question

I'm trying to get any of the demo examples to work but keep getting this error in the browser.
Cannot read property 'onLayoutChange' of undefined.
In this function:
onLayoutChange(layout) {
this.props.onLayoutChange(layout);
I have the following versions installed and working on windows:
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-grid-layout": "^0.16.3",
"react-scripts": "1.1.0"

Thank you

stale

Most helpful comment

I know I'm late on this, but I hope it will help someone else who may stumble upon that.
Besides removing the line "this.props.onLayoutChange(layout);", I also had to bind "onLayoutChange" in the constructor just after "this.onAddItem = this.onAddItem.bind(this);" line:
this.onLayoutChange = this.onLayoutChange.bind(this);

All 4 comments

Seems the code is intended to get onLayoutChange function prop from parent(Probably should add a check for this particular prop exist)
Try removing the line "this.props.onLayoutChange(layout);"

this fixed it:
onLayoutChange={() => this.onLayoutChange}
onBreakpointChange={() => this.onBreakpointChange}

But there is no resizing. How do I turn that on? I literally used the exact code from this sample:
https://github.com/STRML/react-grid-layout/blob/master/test/examples/6-dynamic-add-remove.jsx

but there is no resizing widget on the bottom right corner as they are showing it.

I know I'm late on this, but I hope it will help someone else who may stumble upon that.
Besides removing the line "this.props.onLayoutChange(layout);", I also had to bind "onLayoutChange" in the constructor just after "this.onAddItem = this.onAddItem.bind(this);" line:
this.onLayoutChange = this.onLayoutChange.bind(this);

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this issue will be closed in 7 days

Was this page helpful?
0 / 5 - 0 ratings