React Native ScrollView 防止/允许在滚动开始事件上滚动

Question

I have a ScrollView (actually Animated.ScrollView ) that I'd like to decide whether to allow vertically scroll or not on scroll start, based on some states of inner components. I know there is a scrollEnabled property which works but the scroll view contains some components that that a few frames to render and changing scrollEnabled property based on inner views' interactions cause a re-render, which drops a few frames and because of the nature of my app needing to change this property based on some animation/smooth scrolling of the inner views, those dropped frames cause a negative user experience.

I've also tried preventDefault of the scroll begin drag event but nothing changed (it allows scrolling regardless of I call it or not).

How can I decide whether or not to allow scrolling of scroll view dynamically on scroll start without a state/props update (which causes a re-render of an expensive view tree, dropping frames)? Something like pan responder's onMoveShouldSetPanResponder[Capture] events might be of great help but returning false from them just don't work (it captures and scrolls regardlessly even though they are called). (I'm on React Native 0.64)

Answer 1

After reading the post in https://codedaily.io/courses/Master-React-Native-Animations/Using-and-Understanding-setNativeProps I solved it by setting native props on scroll view (that I reference directly using a ref ) instead of updating state, preventing a re-render:

this.state.scrollView.current?.setNativeProps({
    scrollEnabled: false
});