reactjs - 更改活动索引时如何使React Native tabview滚动回选项卡顶部

Question

我有一个具有以下结构的屏幕：

<ScrollView>
  <View style={styles.container}>
    <View style={styles.topPanel} />
    <View style={styles.titleSection}>
      <View>
        <Image style={styles.profilePicture} source={logos} />
      </View>
      <View style={styles.textComponent}>
        <TextComponent
          boldness="extraBold"
          style={styles.titleSection__title}>
          ...
        </TextComponent>
        <TextComponent
          boldness="semiBold"
          style={styles.titleSection__text}>
          ...
        </TextComponent>
      </View>
      <View style={styles.verticalLine} />
      <RatingAndLocation location={6} medianRating={4.2} />
      <View>
        <TextComponent
          boldness="semiBold"
          style={styles.titleSection__desc}>
          ...
        </TextComponent>
      </View>
      <View style={styles.verticalLine} />
    </View>
  </View>
  <TabView images={images} setGalleryIndex={setGalleryIndex} />
</ScrollView>

Tabview 组件包含react-native-tabview作为滚动视图的选项卡，其中包含内容。我正在尝试像这样设置scrollView的滚动位置：

navigation.addListener('blur', () => {
  scrollViewRef.scrollTo({ y: 0, x: 0, animated: true });
});

但它不起作用。嵌套的滚动视图不起作用。他们不会触发 onScroll 事件。只有父滚动视图会这样做。我想知道是否有办法解决这个问题。

据我了解，您不能嵌套垂直滚动视图，但是如何让每个选项卡成为单独的滚动视图并在更改索引时滚动到它的顶部？

以下是它的样子：