feat(componentList):为菜单项添加图标和选中状态

master
钟良源 4 months ago
parent 4359fd8247
commit 742beda43e

Binary file not shown.

Before

Width:  |  Height:  |  Size: 909 B

After

Width:  |  Height:  |  Size: 403 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 833 B

After

Width:  |  Height:  |  Size: 401 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 558 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 830 B

@ -9,9 +9,24 @@ const GlobalVarContainer = () => {
const [selectedItem, setSelectedItem] = useState('数字类型');
const menuItems = [
'我的组件',
'协同组件',
'组件审核'
{
key: '1',
label: '我的组件',
icon: '/ideContainer/icon/myComp.png',
activeIcon: '/ideContainer/icon/myComp_active.png'
},
{
key: '2',
label: '协同组件',
icon: '/ideContainer/icon/teamComp.png',
activeIcon: '/ideContainer/icon/teamComp_active.png'
},
{
key: '3',
label: '组件审核',
icon: '/ideContainer/icon/compAudit.png',
activeIcon: '/ideContainer/icon/compAudit_active.png'
}
];
return (
@ -21,10 +36,12 @@ const GlobalVarContainer = () => {
{menuItems.map((item, index) => (
<div
key={index}
className={selectedItem === item ? styles['selected'] : ''}
onClick={() => setSelectedItem(item)}
className={selectedItem === item.label ? styles['selected'] : ''}
onClick={() => setSelectedItem(item.label)}
>
{item}
<img src={selectedItem === item.label ? item.activeIcon : item.icon} alt=""
style={{ width: 20, height: 20, marginRight: 12 }} />
<span>{item.label}</span>
</div>
))}
</div>

Loading…
Cancel
Save