You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
ScreenClassProvider can be called with useOwnWidth, however this doesn't result in the current screen class until after the window is resized. This is what happens:
ScreenClassProvider calls useScreenClass with no source (since the child is not yet mounted), which returns the screen class of the window.
On the next render ScreenClassProvider calls useScreenClass with the correct source. useScreenClass then calls useState with getScreenClass() as the default value. The screen class is correctly calculated by getScreenClass, however useState returns the previous value since there's no reason for it to change.
In order to work around the issue, I have to force a resize event after my component is mounted:
Hi,
ScreenClassProvider can be called with useOwnWidth, however this doesn't result in the current screen class until after the window is resized. This is what happens:
ScreenClassProvider
callsuseScreenClass
with no source (since the child is not yet mounted), which returns the screen class of the window.On the next render
ScreenClassProvider
callsuseScreenClass
with the correct source.useScreenClass
then callsuseState
withgetScreenClass()
as the default value. The screen class is correctly calculated bygetScreenClass
, howeveruseState
returns the previous value since there's no reason for it to change.In order to work around the issue, I have to force a resize event after my component is mounted:
useEffect(() => { window.dispatchEvent(new Event('resize')); }, []);
This causes
useScreenClass
to update the screen class.The text was updated successfully, but these errors were encountered: