Files
react/packages/react-events/docs/ContextMenu.md
Nicolas Gallagher 474b650cac [react-events] Rename hook exports (#16533)
For example, 'useHoverResponder' becomes 'useHover'
2019-08-22 13:30:35 -07:00

884 B

ContextMenu

The useContextMenu hooks responds to context-menu events.

// Example
const Button = (props) => {
  const contextmenu = useContextMenu({
    disabled,
    onContextMenu,
    preventDefault
  });

  return (
    <div listeners={contextmenu}>
      {props.children}
    </div>
  );
};

Types

type ContextMenuEvent = {
  altKey: boolean,
  buttons: 0 | 1 | 2,
  ctrlKey: boolean,
  metaKey: boolean,
  pageX: number,
  pageY: number,
  pointerType: PointerType,
  shiftKey: boolean,
  target: Element,
  timeStamp: number,
  type: 'contextmenu',
  x: number,
  y: number,
}

Props

disabled: boolean = false

Disables the responder.

onContextMenu: (e: ContextMenuEvent) => void

Called when the user performs a gesture to display a context menu.

preventDefault: boolean = true

Prevents the native behavior (i.e., context menu).