标签页右侧没有标题（反应导航/底部标签）

Question

当前行为

我正在选项卡屏幕上添加具有自定义处理行为的headerRight图标，但是当我从屏幕上setOptions时没有图标出现。

类似于setOptions的headerRight会被忽略。

我也尝试过更改headertTitle，结果相同。

预期行为

应该显示headerRight图标 屏幕标题应更改

如何复制

Root.js

<View>
  <NavigationContainer>
    <Stack.Navigator>
      <Stack.Screen name="Home" component={Home} />
      <Stack.Screen name="Details" component={Details} />
    </Stack.Navigator>
  </NavigationContainer>
</View>

Details.js

<Tab.Navigator >
    <Tab.Screen name="Profile" component={Profile} />
    <Tab.Screen name="Settings" component={Settings} />
</Tab.Navigator>

Settings.js

const Settings = ({navigation}) => {
  React.useLayoutEffect(() => {
    navigation.setOptions({
        headerTitle: 'NotSettings',
        headerRight: () => (
            <Icon
            name="plus-circle"
            onPress={() => <custom action>}
            color='red'
            size={25}
            />
        ),
    });
  }, []);

  return (
    <View>Settings Tab</View>
  );
};