为什么反应本机选项卡视图在滑动到下一个选项卡时占用空白空间

Question

在反应本机选项卡视图中，当我滚动到底部并在出现黑色空间时滑动到下一页时。有什么方法可以从顶部重新渲染幻灯片：

const renderTabs = () => {
  return (
    <>
      <TabView
        onIndexChange={index => setIndex(index)}
        navigationState={{index: tabIndex, routes}}
        renderScene={renderScene}
        renderTabBar={renderTabBar}
        initialLayout={{
          height: 0,
          width: Dimensions.get('window').width,
        }}
        // lazy
      />
    </>
  );
};

const renderTabBar = props => {
  const y = scrollY.interpolate({
    inputRange: [0, HeaderHeight],
    outputRange: [HeaderHeight, 0],
    extrapolateRight: 'clamp',
  });
  return (
    <Animated.View
      style={{
        top: 0,
        zIndex: 1,
        position: 'absolute',
        transform: [{translateY: y}],
        width: '100%',
      }}>
      <TabBar
        {...props}
        onTabPress={({route, preventDefault}) => {
          if (isListGliding.current) {
            preventDefault();
          }
        }}
        style={styles.tab}
        renderLabel={renderLabel}
        scrollEnabled={true}
        indicatorStyle={styles.indicator}
      />
    </Animated.View>
  );
};

下一张幻灯片不应占用空白区域 - 当我触摸屏幕并尝试向上滑动时，只有它才会变得响应

Answer 1

您找到解决方案了吗？