react-navigation标题上的React-native-popup-menu

发布时间：2020-12-15 20:30:23 所属栏目：百科来源：网络整理

导读：我正在使用带有react-navigation的redux,并且想要在用户单击react-navigation header右按钮上的按钮时显示弹出窗口. 我在我的应用程序的根目录中包含了上下文菜单,如下所示 return ( Provider store={store} MenuContext style={{ flex: 1 }} AppWithNavigat

我正在使用带有react-navigation的redux,并且想要在用户单击react-navigation header右按钮上的按钮时显示弹出窗口.

我在我的应用程序的根目录中包含了上下文菜单,如下所示

return (
      <Provider store={store}>
          <MenuContext style={{ flex: 1 }}>
              <AppWithNavigationState />
          </MenuContext>
      </Provider>
    )

在我的一个屏幕上,我有

static navigationOptions = {
        headerTitle: 'News',headerRight: (
          <TouchableOpacity style={{ paddingLeft:15,paddingRight:15 }}>
              <Icon name="more-vert" size={30} color="black" />
          </TouchableOpacity>
        ),}

enter image description here

当用户点击右键时,我应该像this

enter image description here

菜单项是动态的,我将不得不从我的一个API中提取数据并开始渲染菜单数据.

我通过在线阅读它可以使用上下文方法实现,但我不知道如何在我的结构中实现它.

任何人都可以告诉我这个吗？
是否可以使用我的局部变量进行渲染？

解决方法

https://www.npmjs.com/package/react-native-material-menu
它对我有用

headerRight:<View  style={{marginRight:10}}>
        <Menu
            ref={this.setMenuRef}
            button={<Text onPress={this.showMenu}><Icon style={{color:screenProps.headerTitleStyle.color,fontSize:25,marginRight:5}} name="md-more"/></Text>}
        >
            <MenuItem onPress={this.hideMenu}>Rate Us</MenuItem>
            <MenuItem onPress={this.hideMenu}>Share App</MenuItem>
            <MenuItem onPress={this.hideMenu}>Settings</MenuItem>
        </Menu>
    </View>,

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!