Skip to content

Commit 985c79f

Browse files
roryabrahamnecolas
authored andcommitted
[fix] Nested scroll in inverted VirtualizedList
Close #2436 Fix #2435
1 parent 03ddd95 commit 985c79f

File tree

1 file changed

+19
-2
lines changed
  • packages/react-native-web/src/vendor/react-native/VirtualizedList

1 file changed

+19
-2
lines changed

packages/react-native-web/src/vendor/react-native/VirtualizedList/index.js

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -732,12 +732,29 @@ class VirtualizedList extends React.PureComponent<Props, State> {
732732
// REACT-NATIVE-WEB patch to preserve during future RN merges: Support inverted wheel scroller.
733733
// For issue https://github.com/necolas/react-native-web/issues/995
734734
this.invertedWheelEventHandler = (ev: any) => {
735+
const scrollOffset = this.props.horizontal ? ev.target.scrollLeft : ev.target.scrollTop;
736+
const scrollLength = this.props.horizontal ? ev.target.scrollWidth : ev.target.scrollHeight;
737+
const clientLength = this.props.horizontal ? ev.target.clientWidth : ev.target.clientHeight;
738+
const isEventTargetScrollable = scrollLength > clientLength;
739+
const delta = this.props.horizontal
740+
? ev.deltaX || ev.wheelDeltaX
741+
: ev.deltaY || ev.wheelDeltaY;
742+
let leftoverDelta = delta;
743+
if (isEventTargetScrollable) {
744+
leftoverDelta = delta < 0
745+
? Math.min(delta + scrollOffset, 0)
746+
: Math.max(delta - (scrollLength - clientLength - scrollOffset), 0);
747+
}
748+
const targetDelta = delta - leftoverDelta;
749+
735750
if (this.props.inverted && this._scrollRef && this._scrollRef.getScrollableNode) {
736751
const node = (this._scrollRef: any).getScrollableNode();
737752
if (this.props.horizontal) {
738-
node.scrollLeft -= ev.deltaX || ev.wheelDeltaX
753+
ev.target.scrollLeft += targetDelta;
754+
node.scrollLeft -= leftoverDelta;
739755
} else {
740-
node.scrollTop -= ev.deltaY || ev.wheelDeltaY
756+
ev.target.scrollTop += targetDelta;
757+
node.scrollTop -= leftoverDelta;
741758
}
742759
ev.preventDefault();
743760
}

0 commit comments

Comments
 (0)