-
Notifications
You must be signed in to change notification settings - Fork 573
/
item.jsx
63 lines (54 loc) · 1.59 KB
/
item.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Menu from '../menu';
import Icon from '../icon';
import Balloon from '../balloon';
const { Tooltip } = Balloon;
/**
* Nav.Item
* @description 继承自 `Menu.Item` 的能力请查看 `Menu.Item` 文档
*/
class Item extends Component {
static menuChildType = 'item';
static propTypes = {
/**
* 自定义图标,可以使用 Icon 的 type,也可以使用组件 `<Icon type="icon type" />`
*/
icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
/**
* 导航内容
*/
children: PropTypes.node,
parentMode: PropTypes.oneOf(['inline', 'popup']),
};
static contextTypes = {
prefix: PropTypes.string,
iconOnly: PropTypes.bool,
hasTooltip: PropTypes.bool,
};
render() {
const { prefix, iconOnly, hasTooltip } = this.context;
const { icon, children, ...others } = this.props;
const iconEl =
typeof icon === 'string' ? (
<Icon className={`${prefix}nav-icon`} type={icon} />
) : (
icon
);
const item = (
<Menu.Item {...others}>
{iconEl}
{children}
</Menu.Item>
);
if (iconOnly && hasTooltip && others.parentMode !== 'popup') {
return (
<Tooltip align="r" trigger={item}>
{children}
</Tooltip>
);
}
return item;
}
}
export default Item;