React-grid-layout: getDerivedStateFromProps not updating the layout properly

Created on 26 Sep 2019  路  4Comments  路  Source: STRML/react-grid-layout

getDerivedStateFromProps seems to not update the layout property, when changing the layout property with the newest React version seemingly nothing happens. I have debugged it and it seems like nextProps.layout and prevState.propLayout are always identical in the getDerivedStateFromProps hook. This might be due to some recent bug fixes by the react team: https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html

Pull request will follow, please have a look.

help wanted stale

Most helpful comment

@Lagily, hey, your example not exact, because array copied only, and not copied items from array which are using by link, so nextProps.layout and prevProps.propsLayout is equal in getDerivedStateFromProps.

Fixed example: https://codesandbox.io/s/quirky-roentgen-jc7i1

Me it seems, this not library problem :slightly_smiling_face:

All 4 comments

We checked this bug on all versions from 16.4 to the current one. We did not meet anything that could disrupt the grid, if you change prop "layout". If you have more information, then share it with us so that we can more accurately reproduce the error.

hey, thanks for checking it out, please check this codesandbox

https://codesandbox.io/s/wizardly-hugle-s7x0h?fontsize=14

After 3 seconds the static flag is set to false and a new state is set, therefore the GridLayout receives a new layout props. However, due to the faulty check for layout change, the new layout is not loaded and the 'a' in the example remains static. The same code run with the changes I made in my pull request results in the layout updating after 3 seconds and therefore the 'a' becomes non static correctly.

Let me know if it's somewhat unclear.

Expected behaviour: After 3 seconds the item 'a' in the grid layout becomes non static.
Actual behaviour: nothing happens, even though the state is updated and the new layout is passed as a prop to the GridLayout

@Lagily, hey, your example not exact, because array copied only, and not copied items from array which are using by link, so nextProps.layout and prevProps.propsLayout is equal in getDerivedStateFromProps.

Fixed example: https://codesandbox.io/s/quirky-roentgen-jc7i1

Me it seems, this not library problem :slightly_smiling_face:

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

Related issues

fsalamida picture fsalamida  路  3Comments

ierhyna picture ierhyna  路  3Comments

Francismb picture Francismb  路  4Comments

sasha240100 picture sasha240100  路  3Comments

hepiyellow picture hepiyellow  路  4Comments