title: Click header right icon of Stack Screen to navigate to other screen in react native
body: <p>I want to navigate to cart screen when I click on cart icon from header right of Stack Screen. Please suggest me how to achieve the requirement. Below is my code.</p>
  <p><strong>App.js</strong></p>
  <pre><code>import Feather from 'react-native-vector-icons/Feather';
  import { NavigationContainer } from '@react-navigation/native';
  import { createStackNavigator } from '@react-navigation/stack';
  import Home from './screens/Home';
  import CartScreen from './screens/Cart';
  
  
  const { width: WIDTH } = Dimensions.get('window')
  
  
  const Stack = createStackNavigator();
  
  function CartIcon() {
    return (
      &lt;Feather name={'shopping-cart'}/&gt;
    );
  }
  
  function App() {
    return (
      &lt;NavigationContainer&gt;
        &lt;Stack.Navigator initialRouteName=&quot;Home&quot;&gt;
  
          &lt;Stack.Screen name=&quot;Home&quot;
            component={Home}
            options={{
             headerRight: props =&gt; &lt;CartIcon  {...props} /&gt;,
              ),
              title: 'Shop',
              headerStyle: {
                backgroundColor: 'black',
              },
            }} /&gt;
  
  
          &lt;Stack.Screen
            name=&quot;Cart Screen&quot;
            component={CartScreen}
            options={{
              title: 'Cart Items',
              headerStyle: {
                backgroundColor: 'black',
              },
            }} /&gt;
        &lt;/Stack.Navigator&gt;
      &lt;/NavigationContainer&gt;
    );
  }
  export default App;
  </code></pre>
  <p>Please help me.. Many Thanks in advance! :)</p>