React Native ScrollView prevent/allow 在滚动开始事件上滚动
React Native ScrollView prevent/allow scrolling on scroll start event
我有一个 ScrollView(实际上是 Animated.ScrollView
),我想根据内部组件的某些状态来决定是否允许在滚动开始时垂直滚动。我知道有一个 scrollEnabled
属性 可以工作,但是滚动视图包含一些组件,需要几帧渲染并根据内部视图的交互导致更改 scrollEnabled
属性重新渲染,丢掉几帧,并且由于我的应用程序的性质需要根据 animation/smooth 滚动内部视图来更改此 属性,这些丢帧会导致负面的用户体验。
我也尝试了 preventDefault
滚动开始拖动事件,但没有任何改变(无论我是否调用它,它都允许滚动)。
如何决定是否允许在滚动开始时动态滚动滚动视图而不进行 state/props 更新(这会导致重新渲染昂贵的视图树,丢帧)?类似 pan responder 的 onMoveShouldSetPanResponder[Capture]
事件可能会有很大帮助,但从它们返回 false
只是行不通(即使它们被调用,它也会捕获和滚动)。 (我正在使用 React Native 0.64)
阅读 https://codedaily.io/courses/Master-React-Native-Animations/Using-and-Understanding-setNativeProps 中的 post 后,我通过在滚动视图上设置本机道具(我直接使用 ref
引用)而不是更新状态来解决它,防止重新-渲染:
this.state.scrollView.current?.setNativeProps({
scrollEnabled: false
});
我有一个 ScrollView(实际上是 Animated.ScrollView
),我想根据内部组件的某些状态来决定是否允许在滚动开始时垂直滚动。我知道有一个 scrollEnabled
属性 可以工作,但是滚动视图包含一些组件,需要几帧渲染并根据内部视图的交互导致更改 scrollEnabled
属性重新渲染,丢掉几帧,并且由于我的应用程序的性质需要根据 animation/smooth 滚动内部视图来更改此 属性,这些丢帧会导致负面的用户体验。
我也尝试了 preventDefault
滚动开始拖动事件,但没有任何改变(无论我是否调用它,它都允许滚动)。
如何决定是否允许在滚动开始时动态滚动滚动视图而不进行 state/props 更新(这会导致重新渲染昂贵的视图树,丢帧)?类似 pan responder 的 onMoveShouldSetPanResponder[Capture]
事件可能会有很大帮助,但从它们返回 false
只是行不通(即使它们被调用,它也会捕获和滚动)。 (我正在使用 React Native 0.64)
阅读 https://codedaily.io/courses/Master-React-Native-Animations/Using-and-Understanding-setNativeProps 中的 post 后,我通过在滚动视图上设置本机道具(我直接使用 ref
引用)而不是更新状态来解决它,防止重新-渲染:
this.state.scrollView.current?.setNativeProps({
scrollEnabled: false
});