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
I'm not sure, if this carousel support dynamic rendering like in example below. I've tried implementing this, but it doesn't work.
In Docs it says it can't support dynamic rendering inside of another component, but in this case, this is loop, and just uses component to render item (it's not rendering multiple items in component).
Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
Check the render method of `StrictPanel2`.
at Item (http://127.0.0.1:5173/src/components/Home/UpcomingCarousel/Item.jsx?t=1705825172181:19:16)
at StrictPanel2 (http://127.0.0.1:5173/node_modules/.vite/deps/@egjs_react-flicking.js?v=a7739631:600:43)
at div
at div
at Flicking3 (http://127.0.0.1:5173/node_modules/.vite/deps/@egjs_react-flicking.js?v=a7739631:702:24)
at div
at UpcomingCarousel (http://127.0.0.1:5173/src/components/Home/UpcomingCarousel/UpcomingCarousel.jsx?t=1705829006020:37:5)
at Home
at RenderedRoute (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=a7739631:3330:5)
at Routes (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=a7739631:3771:5)
at App
at AuthProvider (http://127.0.0.1:5173/src/context/AuthContext.jsx:24:3)
at Router (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=a7739631:3718:15)
at BrowserRouter (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=a7739631:4198:5)
printWarning @ chunk-GSZ7ISAW.js?v=a7739631:521
error @ chunk-GSZ7ISAW.js?v=a7739631:505
validateFunctionComponentInDev @ chunk-GSZ7ISAW.js?v=a7739631:15008
mountIndeterminateComponent @ chunk-GSZ7ISAW.js?v=a7739631:14983
beginWork @ chunk-GSZ7ISAW.js?v=a7739631:15902
beginWork$1 @ chunk-GSZ7ISAW.js?v=a7739631:19749
performUnitOfWork @ chunk-GSZ7ISAW.js?v=a7739631:19194
workLoopSync @ chunk-GSZ7ISAW.js?v=a7739631:19133
renderRootSync @ chunk-GSZ7ISAW.js?v=a7739631:19112
performConcurrentWorkOnRoot @ chunk-GSZ7ISAW.js?v=a7739631:18674
workLoop @ chunk-GSZ7ISAW.js?v=a7739631:197
flushWork @ chunk-GSZ7ISAW.js?v=a7739631:176
performWorkUntilDeadline @ chunk-GSZ7ISAW.js?v=a7739631:384
Show 13 more frames
Show less
6[Violation] Added non-passive event listener to a scroll-blocking <some> event. Consider marking event handler as 'passive' to make the page more responsive. See <URL>
chunk-GSZ7ISAW.js?v=a7739631:16659 Uncaught TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'.
at getStyle (chunk-D4UNAIAO.js?v=a7739631:4451:17)
at __proto.resize (chunk-D4UNAIAO.js?v=a7739631:8217:21)
at chunk-D4UNAIAO.js?v=a7739631:7508:22
at Array.forEach (<anonymous>)
at __proto.updatePanelSize (chunk-D4UNAIAO.js?v=a7739631:7507:23)
at __proto._initialResize (chunk-D4UNAIAO.js?v=a7739631:10119:14)
at __proto.init (chunk-D4UNAIAO.js?v=a7739631:9743:10)
at new Flicking2 (chunk-D4UNAIAO.js?v=a7739631:8689:18)
at __proto.componentDidMount (@egjs_react-flicking.js?v=a7739631:736:20)
at commitLayoutEffectOnFiber (chunk-GSZ7ISAW.js?v=a7739631:17020:36)
getStyle @ chunk-D4UNAIAO.js?v=a7739631:4451
__proto.resize @ chunk-D4UNAIAO.js?v=a7739631:8217
(anonymous) @ chunk-D4UNAIAO.js?v=a7739631:7508
__proto.updatePanelSize @ chunk-D4UNAIAO.js?v=a7739631:7507
__proto._initialResize @ chunk-D4UNAIAO.js?v=a7739631:10119
__proto.init @ chunk-D4UNAIAO.js?v=a7739631:9743
Flicking2 @ chunk-D4UNAIAO.js?v=a7739631:8689
__proto.componentDidMount @ @egjs_react-flicking.js?v=a7739631:736
commitLayoutEffectOnFiber @ chunk-GSZ7ISAW.js?v=a7739631:17020
commitLayoutMountEffects_complete @ chunk-GSZ7ISAW.js?v=a7739631:17976
commitLayoutEffects_begin @ chunk-GSZ7ISAW.js?v=a7739631:17965
commitLayoutEffects @ chunk-GSZ7ISAW.js?v=a7739631:17916
commitRootImpl @ chunk-GSZ7ISAW.js?v=a7739631:19349
commitRoot @ chunk-GSZ7ISAW.js?v=a7739631:19273
finishConcurrentRender @ chunk-GSZ7ISAW.js?v=a7739631:18801
performConcurrentWorkOnRoot @ chunk-GSZ7ISAW.js?v=a7739631:18714
workLoop @ chunk-GSZ7ISAW.js?v=a7739631:197
flushWork @ chunk-GSZ7ISAW.js?v=a7739631:176
performWorkUntilDeadline @ chunk-GSZ7ISAW.js?v=a7739631:384
Show 19 more frames
Show less
chunk-GSZ7ISAW.js?v=a7739631:14036 The above error occurred in the <Flicking3> component:
at Flicking3 (http://127.0.0.1:5173/node_modules/.vite/deps/@egjs_react-flicking.js?v=a7739631:702:24)
at div
at UpcomingCarousel (http://127.0.0.1:5173/src/components/Home/UpcomingCarousel/UpcomingCarousel.jsx?t=1705829006020:37:5)
at Home
at RenderedRoute (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=a7739631:3330:5)
at Routes (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=a7739631:3771:5)
at App
at AuthProvider (http://127.0.0.1:5173/src/context/AuthContext.jsx:24:3)
at Router (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=a7739631:3718:15)
at BrowserRouter (http://127.0.0.1:5173/node_modules/.vite/deps/react-router-dom.js?v=a7739631:4198:5)
Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.
logCapturedError @ chunk-GSZ7ISAW.js?v=a7739631:14036
update.callback @ chunk-GSZ7ISAW.js?v=a7739631:14056
callCallback @ chunk-GSZ7ISAW.js?v=a7739631:10511
commitUpdateQueue @ chunk-GSZ7ISAW.js?v=a7739631:10528
commitLayoutEffectOnFiber @ chunk-GSZ7ISAW.js?v=a7739631:17083
commitLayoutMountEffects_complete @ chunk-GSZ7ISAW.js?v=a7739631:17976
commitLayoutEffects_begin @ chunk-GSZ7ISAW.js?v=a7739631:17965
commitLayoutEffects @ chunk-GSZ7ISAW.js?v=a7739631:17916
commitRootImpl @ chunk-GSZ7ISAW.js?v=a7739631:19349
commitRoot @ chunk-GSZ7ISAW.js?v=a7739631:19273
performSyncWorkOnRoot @ chunk-GSZ7ISAW.js?v=a7739631:18891
flushSyncCallbacks @ chunk-GSZ7ISAW.js?v=a7739631:9135
commitRootImpl @ chunk-GSZ7ISAW.js?v=a7739631:19428
commitRoot @ chunk-GSZ7ISAW.js?v=a7739631:19273
finishConcurrentRender @ chunk-GSZ7ISAW.js?v=a7739631:18801
performConcurrentWorkOnRoot @ chunk-GSZ7ISAW.js?v=a7739631:18714
workLoop @ chunk-GSZ7ISAW.js?v=a7739631:197
flushWork @ chunk-GSZ7ISAW.js?v=a7739631:176
performWorkUntilDeadline @ chunk-GSZ7ISAW.js?v=a7739631:384
Show 19 more frames
Show less
chunk-GSZ7ISAW.js?v=a7739631:9145 Uncaught TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'.
at getStyle (chunk-D4UNAIAO.js?v=a7739631:4451:17)
at __proto.resize (chunk-D4UNAIAO.js?v=a7739631:8217:21)
at chunk-D4UNAIAO.js?v=a7739631:7508:22
at Array.forEach (<anonymous>)
at __proto.updatePanelSize (chunk-D4UNAIAO.js?v=a7739631:7507:23)
at __proto._initialResize (chunk-D4UNAIAO.js?v=a7739631:10119:14)
at __proto.init (chunk-D4UNAIAO.js?v=a7739631:9743:10)
at new Flicking2 (chunk-D4UNAIAO.js?v=a7739631:8689:18)
at __proto.componentDidMount (@egjs_react-flicking.js?v=a7739631:736:20)
at commitLayoutEffectOnFiber (chunk-GSZ7ISAW.js?v=a7739631:17020:36)
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
I'm not sure, if this carousel support dynamic rendering like in example below. I've tried implementing this, but it doesn't work.
In Docs it says it can't support dynamic rendering inside of another component, but in this case, this is loop, and just uses component to render item (it's not rendering multiple items in component).
Here's error I get if you find it useful:
Beta Was this translation helpful? Give feedback.
All reactions