单击显示选项时反应本机

Question

在android手机联系页面中，右上角有一个三个点图标（第一张图片）。单击后，将显示一个菜单（第二张图片）。

我已经搜索了，但是找不到任何第三方软件包来解决此问题。我不想使用 Picker 或类似的工具。

Answer 1

我会使用这样的软件包：https://www.npmjs.com/package/react-native-material-menu

以下是如何使用此程序包的简单代码段：

import React from 'react';


import { View, Text } from 'react-native';
import Menu, { MenuItem, MenuDivider } from 'react-native-material-menu';

class App extends React.PureComponent {
  _menu = null;

  setMenuRef = ref => {
    this._menu = ref;
  };

  hideMenu = () => {
    this._menu.hide();
  };

  showMenu = () => {
    this._menu.show();
  };

  render() {
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Menu
          ref={this.setMenuRef}
          button={<Text onPress={this.showMenu}>Show menu</Text>}
        >
          <MenuItem onPress={this.hideMenu}>Menu item 1</MenuItem>
          <MenuItem onPress={this.hideMenu}>Menu item 2</MenuItem>
          <MenuItem onPress={this.hideMenu} disabled>
            Menu item 3
          </MenuItem>
          <MenuDivider />
          <MenuItem onPress={this.hideMenu}>Menu item 4</MenuItem>
        </Menu>
      </View>
    );
  }
}

export default App;