如何在选项卡栏react native中的图标顶部添加一行

import React from 'react';
import { View, Text, Image } from 'react-native';

const TabIconWithBadge = ({ icon, badge }) => {
  return (
    <View>
      <Image source={icon} />
      <Text>{badge}</Text>
    </View>
  );
};

export default TabIconWithBadge;

import React from 'react';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import TabIconWithBadge from './TabIconWithBadge';

const Tab = createBottomTabNavigator();

const App = () => {
  return (
    <Tab.Navigator>
      <Tab.Screen
        name="Home"
        component={HomeScreen}
        options={{
          tabBarIcon: ({ focused }) => (
            <TabIconWithBadge
              icon={focused ? require('./images/home_active.png') : require('./images/home_inactive.png')}
              badge="New"
            />
          ),
        }}
      />
      {/* 其他选项卡 */}
    </Tab.Navigator>
  );
};

export default App;