mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-28 05:05:48 +08:00
fix: BreadcrumbItemType missing onClick func (#41283)
* feat: BreadcrumbItemType add onClick * chore: update * fix: 补充className * chore: update
This commit is contained in:
parent
39adae8e5c
commit
6c8082a474
@ -33,6 +33,8 @@ export interface BreadcrumbItemType {
|
||||
menu?: BreadcrumbItemProps['menu'];
|
||||
/** @deprecated Please use `menu` instead */
|
||||
overlay?: React.ReactNode;
|
||||
className?: string;
|
||||
onClick?: React.MouseEventHandler<HTMLAnchorElement | HTMLSpanElement>;
|
||||
}
|
||||
export interface BreadcrumbSeparatorType {
|
||||
type: 'separator';
|
||||
@ -145,7 +147,16 @@ const Breadcrumb: CompoundedComponent = (props) => {
|
||||
const itemRenderRoutes: any = items || legacyRoutes;
|
||||
|
||||
crumbs = mergedItems.map((item, index) => {
|
||||
const { path, key, type, menu, overlay, separator: itemSeparator } = item;
|
||||
const {
|
||||
path,
|
||||
key,
|
||||
type,
|
||||
menu,
|
||||
overlay,
|
||||
onClick,
|
||||
className: itemClassName,
|
||||
separator: itemSeparator,
|
||||
} = item;
|
||||
const mergedPath = getPath(params, path);
|
||||
|
||||
if (mergedPath !== undefined) {
|
||||
@ -167,6 +178,10 @@ const Breadcrumb: CompoundedComponent = (props) => {
|
||||
itemProps.overlay = overlay as any;
|
||||
}
|
||||
|
||||
if (itemClassName) {
|
||||
itemProps.className = itemClassName;
|
||||
}
|
||||
|
||||
let { href } = item;
|
||||
if (paths.length && mergedPath !== undefined) {
|
||||
href = `#/${paths.join('/')}`;
|
||||
@ -182,6 +197,7 @@ const Breadcrumb: CompoundedComponent = (props) => {
|
||||
})}
|
||||
href={href}
|
||||
separator={isLastItem ? '' : separator}
|
||||
onClick={onClick}
|
||||
>
|
||||
{mergedItemRender(item as BreadcrumbItemType, params, itemRenderRoutes, paths)}
|
||||
</BreadcrumbItem>
|
||||
|
@ -329,4 +329,18 @@ describe('Breadcrumb', () => {
|
||||
expect(errSpy).not.toHaveBeenCalled();
|
||||
errSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('should use `onClick`', async () => {
|
||||
const onClick = jest.fn();
|
||||
const wrapper = render(<Breadcrumb items={[{ title: 'test', onClick }]} />);
|
||||
const item = await wrapper.findByText('test');
|
||||
item.click();
|
||||
expect(onClick).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
it('should use `className`', async () => {
|
||||
const testClassName = 'testClassName';
|
||||
const wrapper = render(<Breadcrumb items={[{ title: 'test', className: testClassName }]} />);
|
||||
const item = await wrapper.findByText('test');
|
||||
expect(item).toHaveClass(testClassName);
|
||||
});
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user