5

ReactNavigation Stack Navigator 具有 HeaderRight 属性，可用于将菜单按钮放置在标题中，但没有上下文菜单。

是否可以在 Stack Navigator 中集成 React Native 弹出菜单？

提前致谢。

4

3 回答 3

1

是绝对可以实现的。在您的根应用程序中执行以下操作：

import React, { Component } from 'react';
import { MenuContext } from 'react-native-popup-menu';
import MainNavigator from './components/MainNavigator';

export default class App extends Component {
  render() {
    return (
      <MenuContext>
        <MainNavigator />
      </MenuContext>
    );
  }
}

那么你实现你的方式headerRight应该可以完美地工作。

于 2017-08-08T18:54:19.203 回答
0

我也一直想知道这一点，并找到了一个解决方案：通常，所有菜单部分都必须在Menu标签内，所以也是如此MenuTrigger。您可以设置样式，MenuTrigger但我没有将其放入顶部栏中。

好消息：它比这更容易，只需将整个Menu放入您的navigationOptions这样：

static navigationOptions = ({navigation}) => ({
  title: 'Uploaded Videos',
  drawerLockMode: 'locked-closed',
  headerRight: 
    <Menu renderer={SlideInMenu} style={{ zIndex: 10 }}>
      <MenuTrigger text="open menu"/>
      <MenuOptions style={{ flex: 1 }}>
        <Text>Menu</Text>
        <MenuOption onSelect={() => { console.log("clicked") text="Click me" />
      </MenuOptions>
    </Menu>

警告：navigationOptions是静态的，所以在你的菜单中你不能使用组件的功能。但是有一些方法可以解决这个问题，例如在 react-native-navigation中查看这个问题。通常，您应该为此使用 redux。

希望这仍然可以帮助您！

于 2018-02-28T10:27:07.530 回答
0

我将 StackNavigator 的 navigationOptions 设置为 RightHeader

  static navigationOptions = ({ navigation }) => ({
title: `${navigation.state.params.Name}`,
headerRight: (
      <ContextMenuButton
      />)

我想知道是否可以使用React Native Popup Menu，显示并与headerRight结合使用

于 2017-07-14T10:10:00.767 回答