前端: 添加面包屑导航组件
This commit is contained in:
parent
78e945f31b
commit
36004cd96c
37
frontend/src/renderer/components/Breadcrumb.jsx
Normal file
37
frontend/src/renderer/components/Breadcrumb.jsx
Normal file
@ -0,0 +1,37 @@
|
||||
import React from 'react';
|
||||
import { Breadcrumb as AntBreadcrumb } from 'antd';
|
||||
import { HomeOutlined, FolderOutlined } from '@ant-design/icons';
|
||||
|
||||
function Breadcrumb({ path, onNavigate }) {
|
||||
const items = [
|
||||
{
|
||||
title: <HomeOutlined />,
|
||||
href: '#',
|
||||
onClick: (e) => {
|
||||
e.preventDefault();
|
||||
onNavigate?.(null);
|
||||
}
|
||||
},
|
||||
...path.map((item, index) => ({
|
||||
title: (
|
||||
<span
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
onNavigate?.(item.id);
|
||||
}}
|
||||
>
|
||||
<FolderOutlined /> {item.name}
|
||||
</span>
|
||||
)
|
||||
}))
|
||||
];
|
||||
|
||||
return (
|
||||
<AntBreadcrumb
|
||||
items={items}
|
||||
style={{ margin: '16px 0' }}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default Breadcrumb;
|
||||
Loading…
Reference in New Issue
Block a user