按钮未显示在expo react导航标题中

Question

我正在遵循this教程来学习EXPO中的反应导航。在此标题中，当我给按钮时，标题中没有显示它。下面的代码

export default function App() {
    return (
      <NavigationContainer>
        <Stack.Navigator>
          <Stack.Screen
            name="Home"
            component={Homecomponent}
            options={{
              headerTitle: ()=> <Icon name="home" />,
              headerRight: () => (
                <Button
                  onPress={() => alert("This is a button!")}
                  title="Info"
                  color="#00cc00"
                />
              )
            }}
          />
        </Stack.Navigator>
      </NavigationContainer>
    );
}

headerRight按钮未显示。

TIA

Answer 1

 import { HeaderBackButton } from 'react-navigation-stack';
//import Ionicons from 'react-native-vector-icons/MaterialIcons';// add if you have this

   export default function App() {
    return (
      <NavigationContainer>
        <Stack.Navigator>
          <Stack.Screen
            name="Home"
            component={Homecomponent}
            options={{
              headerTitle: ()=> <Icon name="home" />,
              headerRight: () => (
                <HeaderBackButton 
                  onPress={() => alert("This is a button!")}
                  //title="Info"
                  color="#00cc00"
                />
// Here you can add your icon to show info sample code for icon is 
// <Icon name="info" size={25}/>
              )
            }}
          />
        </Stack.Navigator>
      </NavigationContainer>
    );
}

尝试此代码可能对您有帮助