Open chensuhuan opened 1 year ago
Did you find a solution to this?
@chensuhuan Did you find a solution. Facing this too
@WKampel hope you can share a solution if you found one
@WKampel hope you can share a solution if you found one
Temporary solution, this works for me.
recyclerlistview+4.2.0.patch
diff --git a/node_modules/recyclerlistview/dist/reactnative/core/layoutmanager/LayoutManager.js b/node_modules/recyclerlistview/dist/reactnative/core/layoutmanager/LayoutManager.js index 9cd3c57..81847df 100644 --- a/node_modules/recyclerlistview/dist/reactnative/core/layoutmanager/LayoutManager.js +++ b/node_modules/recyclerlistview/dist/reactnative/core/layoutmanager/LayoutManager.js @@ -112,7 +112,7 @@ var WrapGridLayoutManager = /** @class */ (function (_super) { var itemRect = null; var oldLayout = null; for (var i = startIndex; i < itemCount; i++) { - oldLayout = this._layouts[i]; + oldLayout = undefined; var layoutType = this._layoutProvider.getLayoutTypeForIndex(i); if (oldLayout && oldLayout.isOverridden && oldLayout.type === layoutType) { itemDim.height = oldLayout.height; diff --git a/node_modules/recyclerlistview/src/core/layoutmanager/LayoutManager.ts b/node_modules/recyclerlistview/src/core/layoutmanager/LayoutManager.ts index 94c34bd..540c5cf 100644 --- a/node_modules/recyclerlistview/src/core/layoutmanager/LayoutManager.ts +++ b/node_modules/recyclerlistview/src/core/layoutmanager/LayoutManager.ts @@ -130,7 +130,7 @@ export class WrapGridLayoutManager extends LayoutManager { let oldLayout = null;
for (let i = startIndex; i < itemCount; i++) {
From experimenting myself, I found out this happens when item widths have a fraction, like 90.8. How did you come up with this @shiroyk. Are there any downsides?
@itsramiel Discovered through breakpoint debugging, this solution may be better.
recyclerlistview+4.2.0.patch
diff --git a/node_modules/recyclerlistview/dist/reactnative/platform/web/viewrenderer/ViewRenderer.js b/node_modules/recyclerlistview/dist/reactnative/platform/web/viewrenderer/ViewRenderer.js index 2f1b856..e2c2d7a 100644 --- a/node_modules/recyclerlistview/dist/reactnative/platform/web/viewrenderer/ViewRenderer.js +++ b/node_modules/recyclerlistview/dist/reactnative/platform/web/viewrenderer/ViewRenderer.js @@ -90,7 +90,7 @@ var ViewRenderer = /** @class */ (function (_super) { if (fromObserver === void 0) { fromObserver = false; } if (this.props.forceNonDeterministicRendering && this.props.onSizeChanged) { var mainDiv = this._mainDiv; - if (mainDiv) { + if (mainDiv && mainDiv.clientWidth && mainDiv.clientHeight) { this._dim.width = mainDiv.clientWidth; this._dim.height = mainDiv.clientHeight; if (this.props.width !== this._dim.width || this.props.height !== this._dim.height) { diff --git a/node_modules/recyclerlistview/src/platform/web/viewrenderer/ViewRenderer.tsx b/node_modules/recyclerlistview/src/platform/web/viewrenderer/ViewRenderer.tsx index 6652efa..b5d92a2 100644 --- a/node_modules/recyclerlistview/src/platform/web/viewrenderer/ViewRenderer.tsx +++ b/node_modules/recyclerlistview/src/platform/web/viewrenderer/ViewRenderer.tsx @@ -85,7 +85,7 @@ export default class ViewRenderer extends BaseViewRenderer<any> { private _checkSizeChange(fromObserver: boolean = false): void { if (this.props.forceNonDeterministicRendering && this.props.onSizeChanged) { const mainDiv = this._mainDiv; - if (mainDiv) { + if (mainDiv && mainDiv.clientWidth && mainDiv.clientHeight) { this._dim.width = mainDiv.clientWidth; this._dim.height = mainDiv.clientHeight; if (this.props.width !== this._dim.width || this.props.height !== this._dim.height) {
@shiroyk I'll give that a try 👍
I have the same issue. Any fix ?
Run web
Problem: The list variable numColumns=2, when navigating through the reat navigation, clicking to jump to the page and returning again will cause layout errors!
Current behavior
Click to return, layout error!
Video:
https://user-images.githubusercontent.com/131914374/234716986-e151f90c-dc26-400d-99f5-dc8ebd84c4cb.mov
Expected behavior
123
To Reproduce
expo:https://snack.expo.dev/@chensuhuan1995/hello-react-navigation-%7C-react-navigation?platform=web
Platform:
FlashList or MasonryFlashList ,Same error occurred
Environment
x.y.z