react-native-context-menu-view
Use native context menu functionality from React Native. On iOS 13+ this uses UIMenu functionality, and on Android it uses a PopUpMenu.
On iOS 12 and below, nothing happens. You may wish to do a Platform.OS === 'ios' && parseInt(Platform.Version, 10) <= 12 check, and add your own onLongPress handler.
Getting started
$ npm install react-native-context-menu-view --save
Mostly automatic installation
cd ios/
pod install
Usage
import ContextMenu from "react-native-context-menu-view";
const Example = () => {
return (
<ContextMenu
actions={[{ title: "Title 1" }, { title: "Title 2" }]}
onPress={(e) => {
console.warn(
`Pressed ${e.nativeEvent.name} at index ${e.nativeEvent.index}`
);
}}
>
<View style={styles.yourOwnStyles} />
</ContextMenu>
);
};
See example/ for basic usage.
Props
title
Optional. The title above the popup menu.
actions
Array of { title: string, systemIcon?: string, destructive?: boolean, disabled?: boolean, inlineChildren?: boolean, children?: Array<ContextMenuAction> }.
System icon refers to an icon name within SF Symbols.
Destructive items are rendered in red on iOS, and unchanged on Android.
Nested menus are supported on iOS only and result in nested UIMenu which can be optionally displayed inline.
onPress
Optional. When the popup is opened and the user picks an option. Called with { nativeEvent: { index, name } }. When a nested action is selected the top level parent index is used for the callback.
onCancel
Optional. When the popop is opened and the user cancels.
previewBackgroundColor
Optional. The background color of the preview. This is displayed underneath your view. Set this to transparent (or another color) if the default causes issues.
-
Context Context 通过组件树提供了一个传递数据的方法，从而避免了在每一个层级手动的传递 props 属性。 API React.createContext：创建一个上下文的容器(组件), defaultValue可以设置共享的默认数据 const {Provider, Consumer} = React.createContext(defaultValue); Provider(生
-
目录： 安装中间件 react-native-image-zoom-viewer 封装放大图片弹窗组件 调用弹窗组件 具体步骤 1. 安装中间件 react-native-image-zoom-viewer，参考官网 和 官网 版本： "react": "16.8.3", "react-native": "0.59.9", "react-native-image-zoom-viewer": "^3
-
准备工作:具体详情参考React-Native官方文档 IDE: WebStorm 和Android Studio(webstorm不支持java高亮,所以用AS辅助下) demo放到github上了,有需要的可以参考一下. 下载demo 1.为什么调用原生的一些东西? 有时候应用程序需要访问平台API，React Native目前还没有相应的模块。也许你想重用一些现有的Java代码，而
-
RN怎么与native交互的呢？ 下面我们通过一个简单的Demo来实现：RN页面调起Native页面，Native页面选择电话本数据，将数据回传给RN展示。 首先是 Native侧 1、MainActivity package com.rnandroid01; import android.content.Intent; import android.database.Cursor; imp
-
在react-native中使用crosswalk 首先集成react-native，然后将webview替换成crosswalk。项目可以查看我的github。https://github.com/jackwolf1/android-react-native-crosswalk 因为 crosswalk 包中包含的 javax* 会导致重复引用，需要在包中去掉 {% highlight null
-
1.我们有很多项目,想在现有的项目中集成RN,其实是比较简单的,第一步创建Activity: package com.capmanage.activity; import android.app.Activity; import android.content.Context; import android.content.Intent; import android.content.pm.Pa
-
react-native-popup-menu Extensible popup menu component for React Native for Android, iOS and (unofficially) UWP and react-native-web. Features: Simple to use popup/context menu Multiple modes: animat
-
react-native-safe-area-context A flexible way to handle safe area, also works on Android and Web! Getting started npm install react-native-safe-area-context You then need to link the native parts of t
-
function getData() { return [ ['', 'Tesla', 'Nissan', 'Toyota', 'Honda', 'Mazda', 'Ford'], ['2017', 10, 11, 12, 13, 15, 16], ['2018', 10, 11, 12, 13, 15, 16], ['2019', 10, 11, 12, 13, 15, 16], [
-
The context menu is a configurable component that appears when the user right clicks in the editable area. By default it does not disable the operating system’s native context menu, if there are no it
-
With the release TinyMCE 5.0 the context menu plugin has been combined into the editor core. Accordingly the Context Menu documentation has been moved into the core as well.
-
这是一个 jQuery 用来显示上下文菜单（响应鼠标右键）的插件 示例代码： $(document).ready( function() { $("#selector").contextMenu({ menu: 'myMenu' }, function(action, el, pos) { alert(