如何在堆栈导航中使用 HeaderRight 组件导航到其他屏幕

Question

我想导航到其他屏幕按标题右上的个人资料图像堆栈导航器的组件？我已经在我的路由器导航器(选项卡屏幕(中使用了选项卡导航器。附有它的屏幕图像。按标题中的配置文件图标应导航到其他屏幕]1 从"反应"导入反应，{ 组件 };

import {Platform,StyleSheet,
  Text,
  View,Dimensions,Image,TouchableHighlight
} from 'react-native';    
import { TabNavigator, StackNavigator } from 'react-navigation';
import Icon from 'react-native-vector-icons/Ionicons';
import MaterialIcons from 'react-native-vectoricons/MaterialIcons';
import NavigatorScreen from './src/Components/NavigatorScreen.js'
import Favourites from './src/Components/Favourites.js'
import Scenes from './src/Components/Scenes.js'
import Likes from './src/Components/Likes.js'
import profile from './src/Components/Profile.js'
const Navigation = StackNavigator ({ 
          Register: { screen: NavigatorScreen,
            navigationOptions: {
              headerTitle: 'SCENES',
              headerLeft:  <Icon style={{marginLeft:18, color:'#000'}} name={'ios-notifications-outline'} size={28}/>,
              headerRight: <View>

    <TouchableHighlight onPress = { () => navigate ("profile", {}) }>
                              <Image borderRadius={14}
                                style={{width: 28, height: 28,marginRight: 18, borderWidth:1}}
                                source={{uri : 'https://s3.amazonaws.com/uifaces/faces/twitter/nuraika/128.jpg'}}
                              />
                            </TouchableHighlight>
                           </View>,       
                            headerTintColor: 'white',
                            headerStyle:{
                                backgroundColor: '#fff',
                                shadowOpacity: 0,
                                shadowOffset: {
                                  height: 0,
                                  width:0
                                },
                                shadowRadius: 0,
                                elevation: 0,
                              },
                            headerTitleStyle: {
                                color: '#36292a',
                                fontFamily: 'WorkSans-Regular',
                                fontWeight: '300',
                                fontSize: 14,
                                alignSelf: 'center'
                              },   
                          }
                        },
          profile: {                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               
            screen: profile
          },
        });
        export default Navigation;
        const styles = StyleSheet.create({
          container: {
            flex: 1,
            justifyContent: 'center',
            alignItems: 'center',
            backgroundColor: '#F5FCFF',
          },
          welcome: {
            fontSize: 20,
            textAlign: 'center',
            margin: 10,
          },
          instructions: {
            textAlign: 'center',
            color: '#333333',
            marginBottom: 5,
          },
        });

Answer 1

这就是你想要的。

navigationOptions : (props) => {
        const {navigation} = props;
        return ({
            ...
            headerRight:<TouchableOpacity onPress = {() => navigation.navigate ("profile", {}) }> /*your code*/
            ...
        })
    }

Answer 2

此错误只是

因为 editProductSceen 期望 id，但当我单击图标时，我没有传递 id。 所以我解决了此错误以通过在编辑屏幕中使用此代码来应用检查

let prodId = null;
  if (route.params && route.params.prodId) {
    prodId = route.params.prodId;
  }

而不是 const {prodIs} = route.params