如何在不重新渲染所有子组件的情况下更新material-bottom-tabs标记文本？

import * as React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createMaterialBottomTabNavigator } from '@react-navigation/material-bottom-tabs';
import { useFocusEffect } from '@react-navigation/native';

const Tab = createMaterialBottomTabNavigator();

function HomeScreen() {
  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <Text>Home!</Text>
    </View>
  );
}

function SettingsScreen({ navigation }) {
  const [tabLabel, setTabLabel] = React.useState('Settings');

  useFocusEffect(
    React.useCallback(() => {
      // 更新标签文本的逻辑
      setTabLabel('New Settings Label');
    }, [])
  );

  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <Text>Settings!</Text>
    </View>
  );
}

export default function App() {
  return (
    <NavigationContainer>
      <Tab.Navigator>
        <Tab.Screen name="Home" component={HomeScreen} />
        <Tab.Screen
          name="Settings"
          component={SettingsScreen}
          options={({ route }) => ({
            tabBarLabel: route.state && route.state.routes[route.state.index].state ? route.state.routes[route.state.index].state.label : 'Settings',
          })}
        />
      </Tab.Navigator>
    </NavigationContainer>
  );
}