mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-19 11:58:41 +08:00
2a5408ded2
Some checks are pending
Publish Any Commit / build (push) Waiting to run
🔀 Sync mirror to Gitee / mirror (push) Waiting to run
✅ test / lint (push) Waiting to run
✅ test / test-react-legacy (16, 1/2) (push) Waiting to run
✅ test / test-react-legacy (16, 2/2) (push) Waiting to run
✅ test / test-react-legacy (17, 1/2) (push) Waiting to run
✅ test / test-react-legacy (17, 2/2) (push) Waiting to run
✅ test / test-node (push) Waiting to run
✅ test / test-react-latest (dom, 1/2) (push) Waiting to run
✅ test / test-react-latest (dom, 2/2) (push) Waiting to run
✅ test / test-react-latest-dist (dist, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist, 2/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 2/2) (push) Blocked by required conditions
✅ test / test-coverage (push) Blocked by required conditions
✅ test / build (push) Waiting to run
✅ test / test lib/es module (es, 1/2) (push) Waiting to run
✅ test / test lib/es module (es, 2/2) (push) Waiting to run
✅ test / test lib/es module (lib, 1/2) (push) Waiting to run
✅ test / test lib/es module (lib, 2/2) (push) Waiting to run
👁️ Visual Regression Persist Start / test image (push) Waiting to run
* chore: fix link button style and preload behavior * chore: fix link button style and behavior
57 lines
1.5 KiB
TypeScript
57 lines
1.5 KiB
TypeScript
import type { MouseEvent, MouseEventHandler } from 'react';
|
|
import React, { useMemo, forwardRef } from 'react';
|
|
import { Link as DumiLink, useLocation, useAppData, useNavigate } from 'dumi';
|
|
|
|
export interface LinkProps {
|
|
to: string | { pathname?: string; search?: string; hash?: string };
|
|
style?: React.CSSProperties;
|
|
className?: string;
|
|
onClick?: MouseEventHandler;
|
|
component?: React.ComponentType<any>;
|
|
children?: React.ReactNode;
|
|
}
|
|
|
|
const Link = forwardRef<HTMLAnchorElement, React.PropsWithChildren<LinkProps>>(
|
|
({ component, children, to, ...rest }, ref) => {
|
|
const { pathname } = useLocation();
|
|
const { preloadRoute } = useAppData();
|
|
const navigate = useNavigate();
|
|
const href = useMemo<string>(() => {
|
|
if (typeof to === 'object') {
|
|
return `${to.pathname || pathname}${to.search || ''}${to.hash || ''}`;
|
|
}
|
|
return to;
|
|
}, [to]);
|
|
const onClick = (e: MouseEvent<HTMLAnchorElement>) => {
|
|
rest.onClick?.(e);
|
|
if (!href?.startsWith('http')) {
|
|
// Should support open in new tab
|
|
if (!e.metaKey && !e.ctrlKey && !e.shiftKey) {
|
|
e.preventDefault();
|
|
navigate(href);
|
|
}
|
|
}
|
|
};
|
|
if (component) {
|
|
return React.createElement(
|
|
component,
|
|
{
|
|
...rest,
|
|
ref,
|
|
href,
|
|
onClick,
|
|
onMouseEnter: () => preloadRoute?.(href),
|
|
},
|
|
children,
|
|
);
|
|
}
|
|
return (
|
|
<DumiLink ref={ref} {...rest} to={href} prefetch>
|
|
{children}
|
|
</DumiLink>
|
|
);
|
|
},
|
|
);
|
|
|
|
export default Link;
|