contextmenu 小调整

This commit is contained in:
2betop 2020-05-11 14:02:10 +08:00
parent 73f02985ed
commit c03f195d0f
2 changed files with 18 additions and 21 deletions

View File

@ -210,5 +210,6 @@
right: 0; right: 0;
bottom: 0; bottom: 0;
background: transparent; background: transparent;
pointer-events: none;
} }
} }

View File

@ -75,13 +75,13 @@ export class ContextMenu extends React.Component<
} }
componentDidMount() { componentDidMount() {
// document.body.addEventListener('click', this.handleOutClick, true); document.body.addEventListener('click', this.handleOutClick, true);
document.addEventListener('keydown', this.handleKeyDown); document.addEventListener('keydown', this.handleKeyDown);
} }
componentWillUnmount() { componentWillUnmount() {
ContextMenu.instance = this.originInstance; ContextMenu.instance = this.originInstance;
// document.body.removeEventListener('click', this.handleOutClick, true); document.body.removeEventListener('click', this.handleOutClick, true);
document.removeEventListener('keydown', this.handleKeyDown); document.removeEventListener('keydown', this.handleKeyDown);
delete this.originInstance; delete this.originInstance;
} }
@ -106,20 +106,20 @@ export class ContextMenu extends React.Component<
}); });
} }
// @autobind @autobind
// handleOutClick(e: Event) { handleOutClick(e: Event) {
// if ( if (
// !e.target || !e.target ||
// !this.menuRef.current || !this.menuRef.current ||
// this.menuRef.current.contains(e.target as HTMLElement) this.menuRef.current.contains(e.target as HTMLElement)
// ) { ) {
// return; return;
// } }
// if (this.state.isOpened) { if (this.state.isOpened) {
// e.preventDefault(); e.preventDefault();
// this.close(); this.close();
// } }
// } }
handleClick(item: MenuItem) { handleClick(item: MenuItem) {
item.disabled || item.disabled ||
@ -237,11 +237,7 @@ export class ContextMenu extends React.Component<
className className
)} )}
> >
<div <div className={cx(`ContextMenu-overlay`, fadeStyles[status])} />
onContextMenu={this.handleOverlayContextMenu}
onClick={this.close}
className={cx(`ContextMenu-overlay`, fadeStyles[status])}
/>
<div <div
className={cx(`ContextMenu-cursor`)} className={cx(`ContextMenu-cursor`)}
style={{left: `${this.state.x}px`, top: `${this.state.y}px`}} style={{left: `${this.state.x}px`, top: `${this.state.y}px`}}