zoriya/react-native-web
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-web.git synced 2026-05-13 11:25:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

[fix] Nested scroll in inverted VirtualizedList

Browse Source 
Close #2436
Fix #2435
This commit is contained in:
rory
2022-11-22 14:02:28 -08:00
committed by Nicolas Gallagher
parent 03ddd95590
commit 985c79f924
1 changed files with 19 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
packages/react-native-web/src/vendor/react-native/VirtualizedList/index.js vendored
View File

@@ -732,12 +732,29 @@ class VirtualizedList extends React.PureComponent<Props, State> {
// REACT-NATIVE-WEB patch to preserve during future RN merges: Support inverted wheel scroller.
// For issue https://github.com/necolas/react-native-web/issues/995
this.invertedWheelEventHandler = (ev: any) => {
const scrollOffset = this.props.horizontal ? ev.target.scrollLeft : ev.target.scrollTop;
const scrollLength = this.props.horizontal ? ev.target.scrollWidth : ev.target.scrollHeight;
const clientLength = this.props.horizontal ? ev.target.clientWidth : ev.target.clientHeight;
const isEventTargetScrollable = scrollLength > clientLength;
const delta = this.props.horizontal
? ev.deltaX || ev.wheelDeltaX
: ev.deltaY || ev.wheelDeltaY;
let leftoverDelta = delta;
if (isEventTargetScrollable) {
leftoverDelta = delta < 0
? Math.min(delta + scrollOffset, 0)
: Math.max(delta - (scrollLength - clientLength - scrollOffset), 0);
}
const targetDelta = delta - leftoverDelta;
if (this.props.inverted && this._scrollRef && this._scrollRef.getScrollableNode) {
const node = (this._scrollRef: any).getScrollableNode();
if (this.props.horizontal) {
node.scrollLeft -= ev.deltaX || ev.wheelDeltaX
ev.target.scrollLeft += targetDelta;
node.scrollLeft -= leftoverDelta;
} else {
node.scrollTop -= ev.deltaY || ev.wheelDeltaY
ev.target.scrollTop += targetDelta;
node.scrollTop -= leftoverDelta;
}
ev.preventDefault();
}