Node.js 如何只添加一个小点，以显示底部选项卡导航器图标-徽章

我正在尝试在底部选项卡导航器中实现活动图标的通知点。这是我的密码：

const Tab = createBottomTabNavigator();

@inject('store')
@observer
class HomeTabs extends React.Component<HomeProps> {

  render() {
    return (
      <NavigationContainer independent={true} ref={mainNavigationRef}>
        <Tab.Navigator
          screenOptions={({ route }) => ({
            tabBarIcon: ({ focused }) => {
              let iconName='question';
              if (route.name === 'Home') {
                iconName = focused
                  ? 'home'
                  : 'home-outline';
              } 
              else if (route.name === 'Activity') {
                iconName = focused ? 'bell' : 'bell-outline';
              }
              else if (route.name === 'Search') {
                iconName = focused ? 'search-web' : 'magnify';
              }
              else if (route.name === 'Profile') {
                iconName = focused ? 'account' : 'account-outline';
              }

              // You can return any component that you like here!
              return <Icon name={iconName} type='material-community' color='#000000' size={24}/>;
            },
          })}
          tabBarOptions={{
            activeTintColor: 'black',
            inactiveTintColor: 'gray',
          }}
        >
        <Tab.Screen name="Home" component={YourPostsStack} />
        <Tab.Screen name="Activity" component={ActivityStack} options={{tabBarBadge: true}} />
        <Tab.Screen name="Search" component={SearchStack} />
        <Tab.Screen name="Profile" component={ProfileScreen} />
      </Tab.Navigator>
    </NavigationContainer>
    )
  }
}

const Tab=createBottomTabNavigator（）；
@注入（'存储'）
@观察者
类hometab扩展React.Component{
render（）{
返回(
({
tabBarIcon:（{focused}）=>{
让我命名为“问题”；
如果（route.name==='Home'）{
iconName=聚焦
“家”
：“家庭大纲”；
} 
else if（route.name==“活动”）{
iconName=聚焦的“钟形”：“钟形轮廓”；
}
else if（route.name==='Search'）{
iconName=focused？'search-web'：'magnize'；
}
else if（route.name==“Profile”）{
iconName=专注的“账户”：“账户大纲”；
}
//您可以在这里返回您喜欢的任何组件！
返回；
},
})}
禁忌选项={{
activeTintColor:'黑色'，
颜色：“灰色”，
}}
>
)
}
}

---

我在reactNavigation文档中看到了“tabBarBadge”，但它是一个空字符串，这个徽章对于我所需要的东西来说是超大的。我只需要一个小点来表示有通知要查看。有没有其他方法可以使用bottomTabNavigation实现这一点？还有其他想法吗？

有点晚了，但这会奏效：

tabBarBadgeStyle: { backgroundColor: 'blue', height: 12, minWidth: 12, borderRadius: 6},