前端: 添加面包屑导航组件

This commit is contained in:
Frontend Developer 2026-03-10 08:55:07 +00:00
parent 78e945f31b
commit 36004cd96c

View 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;