function getFocusedRouteNameFromRoute return undefined route name

I want to get the name of the route that is in focus now, but the getFocusedRouteNameFromRoute function always returns undifine in the last route.

my code is like this:

return (
<Tab.Navigator
  tabBarOptions={{
    activeTintColor: Colors.iconColor,
    inactiveTintColor: Colors.iconColor,
    inactiveBackgroundColor: Colors.white,
    activeBackgroundColor: Colors.white,
    style: {
      backgroundColor: Colors.white,
    },
  }}
  screenOptions={({ route }) => {
    return {
      tabBarVisible: ["Home", "Forum", "Notification", "Profile"].includes(
        getFocusedRouteNameFromRoute(route)
      ),
    };
  }}
>
  <Tab.Screen
    name="HomeStack"
    component={HomeStack}
  />
  <Tab.Screen
    name="ForumStack"
    component={ForumStack}
  />
  <Tab.Screen
    name="NotificationStack"
    component={NotificationStack}
  />
  <Tab.Screen
    name="ProfileStack"
    component={SettingsStack}
  />
</Tab.Navigator>);

when I log, the result is like this:

screenOptions={({ route }) => {
    console.log('focus ',getFocusedRouteNameFromRoute(route))
    return {
      tabBarVisible: ["Home", "Forum", "Notification", "Profile"].includes(
        getFocusedRouteNameFromRoute(route)
      ),
    };
  }}

log result :

focus Home
focus Forum
focus Notification
focus undifine

package.json :

"@react-navigation/bottom-tabs": "^5.x",
"@react-navigation/native": "^5.x",