react-native-popup-menu - 如何在自定义平面列表中实现这个库

Question

我有一个如下图所示的平面列表。代码是这样的。这种情况下如何实现弹出菜单？

renderList = () => (
    <FlatList
      data={this.props.contracts.data}
      keyExtractor={item => String(item.id)}
      renderItem={({ item }) => <ListItem onPress={() => {}} listItem={item} />}
    />
);

Answer 1

在平面列表中呈现弹出菜单并没有什么特别之处。只需将其放入您的ListItem组件中。

广告“在大多数情况下，您的应用程序中不应有更多菜单提供程序（请参阅 API 文档）。在其他情况下，请使用 skipinstacecheck 道具”警告。通常（如 98% 的情况）您的应用程序中不应有多个MenuProviders。如果你把它放在里面ListItem，它会被渲染多次。只需MenuProvider在您的应用程序顶部使用一个 - 请参阅主自述文件：

将您的应用程序包装在 MenuProvider 中，然后在需要的地方简单地使用 Menu 组件。

您可以查看很多示例，例如https://github.com/instea/react-native-popup-menu/blob/master/examples/InFlatListExample.js