You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
42 lines
1.1 KiB
42 lines
1.1 KiB
import React, { FC } from 'react'
|
|
import { useHistory } from 'react-router-dom'
|
|
import withBreadcrumbs from 'react-router-breadcrumbs-hoc'
|
|
import { Breadcrumb, Button } from 'antd'
|
|
import routes from '@/route/routes'
|
|
import { flattenRoutes } from '@/assets/js/publicFunc'
|
|
|
|
const allRoutes = flattenRoutes(routes)
|
|
|
|
interface Props {
|
|
breadcrumbs: any[];
|
|
}
|
|
|
|
// 通用面包屑
|
|
const Breadcrumbs: FC<Props> = ({ breadcrumbs }) => {
|
|
const history = useHistory()
|
|
return (
|
|
<Breadcrumb style={{ display: 'inline-block' }}>
|
|
{breadcrumbs.map((bc: CommonObjectType, index: number) => {
|
|
return (
|
|
<Breadcrumb.Item key={bc.key}>
|
|
<Button
|
|
disabled={
|
|
(!bc.exact && bc.match.path !== '/') ||
|
|
index === breadcrumbs.length - 1
|
|
}
|
|
onClick={() => {
|
|
history.push(bc.match.path)
|
|
}}
|
|
style={{ padding: '0' }}
|
|
type="link"
|
|
>
|
|
{bc.name}
|
|
</Button>
|
|
</Breadcrumb.Item>
|
|
)
|
|
})}
|
|
</Breadcrumb>
|
|
)
|
|
}
|
|
|
|
export default withBreadcrumbs(allRoutes)(Breadcrumbs)
|