Javascript 如何使用react navigation从标题中的按钮“导航”到新屏幕？

我正在使用

react导航

，希望在标题右侧添加一个按钮，该按钮将导航到不同的屏幕。但是当设置

导航选项时，我想知道如何在按下按钮时调用回调函数：

const RootNavigationStack = StackNavigator({
  PokemonList: {
    screen: PokemonListWrapper,
    navigationOptions: {
      title: ({state}) => `Pokedex`,
      header: ({ state, setParams }) => {
        return {
          visible: true,
          right: (
            <Button
              title={'Add'}
              onPress={() => // navigate to new screen here
            />
          ),
        }
      }
    },
  },
, {
  headerMode: 'screen'
})

const RootNavigationStack=StackNavigator({
口袋妖怪列表：{
屏幕：PokemonListWrapper，
导航选项：{
标题：（{state}）=>`Pokedex`，
标头：（{state，setParams}）=>{
返回{
可见：对，
对:(
//导航到此处的新屏幕
/>
),
}
}
},
},
, {
headerMode:“屏幕”
})

有什么办法可以做到这一点吗？我在考虑可能使用
和导航
，但我仍然不太清楚这将如何工作。
试试这个

    header: ({ navigate }) => ({
       right: (
          <Button onPress={() => navigate('screen2')}  />
       )
    }),

标题：（{navigate}）=>({
对:(
导航（'screen2'）}/>
)
}),
我用这个解决了同样的问题（在屏幕/组件类内部）

静态导航选项=（{navigation}）=>{
返回{
标题:"下一个",，
headerRight:navigation.navigate（'RegPasswordScreen'）}/>
};
};
另一个答案适用于旧版本的react导航

对于新版本，请尝试以下操作：

static navigationOptions = ({ navigation }) => ({
        headerRight: (
            <Button 
                title='Setting' 
                onPress={ () => navigation.navigate('RouteName') }                
                backgroundColor= "rgba(0,0,0,0)"
                color="rgba(0,122,255,1)"
            />
        )});

静态导航选项=（{navigation}）=>({
头灯：(
navigation.navigate（'RouteName'）}
backgroundColor=“rgba（0,0,0,0）”
color=“rgba（0122255,1）”
/>
)});
适用于RN 0.63
static navigationOptions = ({ navigation }) => ({
        headerRight: (
            <Button 
                title='Setting' 
                onPress={ () => navigation.navigate('RouteName') }                
                backgroundColor= "rgba(0,0,0,0)"
                color="rgba(0,122,255,1)"
            />
        )});