test/amis2
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-11-30 11:07:52 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

contextmenu 支持 hover 事件

Browse Source
This commit is contained in:
liaoxuezhi 2019-11-19 18:59:06 +08:00
parent 14460921b8
commit 8185cf7a63
2 changed files with 15 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
scss/components/_context-menu.scss
View File

@ -93,6 +93,7 @@
background: linear-gradient(to bottom, #648bf5 0%, #2866f2 100%);
border-top: 1px solid #5a82eb;
border-bottom: 1px solid #1758e7;
cursor: pointer;
}
&.is-disabled > a {

15
src/components/ContextMenu.tsx
View File

@ -30,6 +30,7 @@ export type MenuItem = {
children?: Array<MenuItem | MenuDivider>;
data?: any;
onSelect?: (data: any) => void;
onHighlight?: (isHiglight: boolean, data: any) => void;
};
export type MenuDivider = '|';
@ -124,6 +125,14 @@ export class ContextMenu extends React.Component<
);
}
handleMouseEnter(item: MenuItem) {
item.disabled || !item.onHighlight || item.onHighlight(true, item.data);
}
handleMouseLeave(item: MenuItem) {
item.disabled || !item.onHighlight || item.onHighlight(false, item.data);
}
renderMenus(menus: Array<MenuItem | MenuDivider>) {
const {classnames: cx} = this.props;
@ -141,7 +150,11 @@ export class ContextMenu extends React.Component<
'is-disabled': item.disabled
})}
>
<a onClick={this.handleClick.bind(this, item)}>
<a
onClick={this.handleClick.bind(this, item)}
onMouseEnter={this.handleMouseEnter.bind(this, item)}
onMouseLeave={this.handleMouseLeave.bind(this, item)}
>
{item.icon ? <span className={item.icon} /> : null}
{item.label}
</a>