javascript - 滚动到特定偏移 y 时显示搜索栏

Question

我在 React Native 中使用平面列表。我想在用户向下滚动并到达时显示搜索栏而不是图标offset.y >= 70，然后将其切换回来offset.y < 0。我尝试onScroll在我的平面列表中设置一个调用我的函数：

 <FlatList
              
   onScroll={showSearchBar}
   scrollEnabled={false}
   data={products}
   numColumns={2}
   keyExtractor={(item) => item.id.toString()}
   renderItem={___}
   onEndReachedThreshold={0.09}
   onEndReached={() => {
   getNewData();
              }}
            />

const showSearchBar = (e) => {
 if (Math.floor(e.nativeEvent.contentOffset.y) >= 70)
 {
   setShowSearch(true);
 }
 else
 {
   setShowSearch(false);
 }
}

      <Stack.Screen
........................
          headerRight: () => {
            if (showSearch) {
              <View>
                <Text>
                 search bar
                </Text>
              </View>
            } else {
              <TouchableOpacity onPress={() => navigation.navigate("about")}>
                <AntDesign
                  name="questioncircleo"
                  size={30}
                  color="white"
                  style={{
                    marginRight: 15,
                    justifyContent: "center",
                  }}
                />
              </TouchableOpacity>;
            }
          },
          title: "",
        })}
        name="home"
        component={Home}
      />

…但它不能正常工作。我试过了while do，switch case但它总是在滚动停止时显示栏搜索......否则它一直显示图标。

标签： javascriptreact-nativeexpo