search

nikitaeverywhere / react-xmasonry

Simple, minimalistic and featured native masonry layout for React JS.
https://zitros.github.io/react-xmasonry
MIT License
90 stars 12 forks source link

Maximum update depth exceeded #19

Closed baltuonis closed 4 years ago

baltuonis commented 4 years ago

I get strange Maximum update depth exceeded error in certain cases when rendering multiple images. Do you know what could be the problem of not stopping recursive calls?

updateContainerWidth
xmasonry.js:148 PARENT
xmasonry.js:124 updateInteral
xmasonry.js:172 545
xmasonry.js:173 updateContainerWidth
react-dom.development.js:23093 Uncaught Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
    at checkForNestedUpdates (react-dom.development.js:23093)
    at scheduleUpdateOnFiber (react-dom.development.js:21164)
    at Object.enqueueSetState (react-dom.development.js:12639)
    at t.Component.setState (react.development.js:471)
    at t.value (xmasonry.js:175)
    at t.value (xmasonry.js:125)
    at t.value (xmasonry.js:149)
    at commitLifeCycles (react-dom.development.js:19835)
    at commitLayoutEffects (react-dom.development.js:22803)
    at HTMLUnknownElement.callCallback (react-dom.development.js:188)
baltuonis commented 4 years ago

It seems to depend on target width settings. When I had it 80 it was causing constant loops. After settings it to 90 I haven't had this anymore (will have to get some users feetback though)

nikitaeverywhere commented 4 years ago

Hello! Thanks for reporting this. Can you attach any demo/example so I can reproduce?

nikitaeverywhere commented 4 years ago

I can't reproduce it with targetBlockWidth=80, it's possible that something's broken on your side. Please attach a reproduction example (CodePens, Demos, etc) so I could take a look. Thank you!