fix(rn): check tab current index frequency

Signed-off-by: Innei <tukon479@gmail.com>
This commit is contained in:
Innei 2025-01-09 00:02:37 +08:00
parent 9c3400a5d5
commit fc3a3cef23
No known key found for this signature in database
GPG Key ID: 0F62D33977F021F7
3 changed files with 19 additions and 14 deletions

View File

@ -1,6 +1,7 @@
import { cn } from "@follow/utils"
import { debounce } from "es-toolkit/compat"
import type { FC } from "react"
import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react"
import { forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState } from "react"
import type {
Animated as AnimatedNative,
StyleProp,
@ -77,19 +78,24 @@ export const TabBar = forwardRef<ScrollView, TabBarProps>(
}, [pagerOffsetX, sharedPagerOffsetX])
const tabRef = useRef<ScrollView>(null)
const handleChangeTabIndex = useCallback((index: number) => {
setCurrentTab(index)
onTabItemPress?.(index)
}, [])
useEffect(() => {
if (!pagerOffsetX) return
const listener = pagerOffsetX.addListener(({ value }) => {
// Calculate which tab should be active based on scroll position
const tabIndex = Math.round(value / tabBarWidth)
if (tabIndex !== currentTab) {
setCurrentTab(tabIndex)
onTabItemPress?.(tabIndex)
}
})
const listener = pagerOffsetX.addListener(
debounce(({ value }) => {
// Calculate which tab should be active based on scroll position
const tabIndex = Math.round(value / tabBarWidth)
if (tabIndex !== currentTab) {
handleChangeTabIndex(tabIndex)
}
}, 36),
)
return () => pagerOffsetX.removeListener(listener)
}, [currentTab, onTabItemPress, pagerOffsetX, tabBarWidth])
}, [currentTab, handleChangeTabIndex, onTabItemPress, pagerOffsetX, tabBarWidth])
useImperativeHandle(ref, () => tabRef.current!)
useEffect(() => {
@ -151,8 +157,7 @@ export const TabBar = forwardRef<ScrollView, TabBarProps>(
{tabs.map((tab, index) => (
<TabItem
onPress={() => {
setCurrentTab(index)
onTabItemPress?.(index)
handleChangeTabIndex(index)
}}
key={tab.value}
isSelected={index === currentTab}

View File

@ -11,8 +11,8 @@ import { Text, TouchableOpacity, View } from "react-native"
import type { PanGestureHandlerGestureEvent } from "react-native-gesture-handler"
import { PanGestureHandler } from "react-native-gesture-handler"
import type { TabComponent } from "@/src/components/ui/tabview"
import { TabView } from "@/src/components/ui/tabview"
import type { TabComponent } from "@/src/components/ui/tabview/TabView"
import { TabView } from "@/src/components/ui/tabview/TabView"
import { apiClient } from "@/src/lib/api-fetch"
import { RSSHubCategoryCopyMap } from "./copy"