diff --git a/components/alert/index.tsx b/components/alert/index.tsx index 82ca38392b..2d9994aaf9 100755 --- a/components/alert/index.tsx +++ b/components/alert/index.tsx @@ -4,7 +4,7 @@ import Animate from 'rc-animate'; import Icon from '../icon'; import classNames from 'classnames'; -function noop() {} +function noop() { } export interface AlertProps { /** @@ -20,7 +20,7 @@ export interface AlertProps { /** Additional content of Alert */ description?: React.ReactNode; /** Callback when close Alert */ - onClose?: React.MouseEventHandler; + onClose?: React.MouseEventHandler; /** Whether to show icon */ showIcon?: boolean; style?: React.CSSProperties; @@ -30,14 +30,14 @@ export interface AlertProps { } export default class Alert extends React.Component { - constructor(props) { + constructor(props: AlertProps) { super(props); this.state = { closing: true, closed: false, }; } - handleClose = (e) => { + handleClose = (e: React.MouseEvent) => { e.preventDefault(); let dom = ReactDOM.findDOMNode(this) as HTMLElement; dom.style.height = `${dom.offsetHeight}px`; diff --git a/components/anchor/AnchorLink.tsx b/components/anchor/AnchorLink.tsx index 1a7e9d2f76..c12855193e 100644 --- a/components/anchor/AnchorLink.tsx +++ b/components/anchor/AnchorLink.tsx @@ -31,7 +31,7 @@ export default class AnchorLink extends React.Component { anchorHelper: AnchorHelper; }; - private _component: Element; + private _component: HTMLAnchorElement; setActiveAnchor() { const { bounds, offsetTop, href, affix } = this.props; @@ -50,25 +50,28 @@ export default class AnchorLink extends React.Component { this.setActiveAnchor(); } - renderAnchorLink = (child) => { - const { href } = child.props; - if (href) { - this.context.anchorHelper.addLink(href); - return React.cloneElement(child, { - onClick: this.props.onClick, - prefixCls: this.props.prefixCls, - affix: this.props.affix, - offsetTop: this.props.offsetTop, - }); + renderAnchorLink = (child: React.ReactChild) => { + // Here child is a ReactChild type + if (typeof child !== 'string' && typeof child !== 'number') { + const { href } = child.props; + if (href) { + this.context.anchorHelper.addLink(href); + return React.cloneElement(child, { + onClick: this.props.onClick, + prefixCls: this.props.prefixCls, + affix: this.props.affix, + offsetTop: this.props.offsetTop, + }); + } } return child; } - refsTo = (component) => { + refsTo = (component: HTMLAnchorElement) => { this._component = component; } - scrollTo = (e) => { + scrollTo = (e: React.MouseEvent) => { e.preventDefault(); const { onClick, href } = this.props; const { anchorHelper } = this.context; diff --git a/components/anchor/anchorHelper.tsx b/components/anchor/anchorHelper.tsx index f5761aeb51..8dedba691c 100644 --- a/components/anchor/anchorHelper.tsx +++ b/components/anchor/anchorHelper.tsx @@ -3,7 +3,7 @@ import getRequestAnimationFrame from '../_util/getRequestAnimationFrame'; export const reqAnimFrame = getRequestAnimationFrame(); -export const easeInOutCubic = (t, b, c, d) => { +export const easeInOutCubic = (t: number, b: number, c: number, d: number) => { const cc = c - b; t /= d / 2; if (t < 1) { @@ -17,7 +17,7 @@ export function getDefaultTarget() { window : null; } -export function getOffsetTop(element): number { +export function getOffsetTop(element: HTMLElement): number { if (!element) { return 0; } @@ -28,10 +28,10 @@ export function getOffsetTop(element): number { const rect = element.getBoundingClientRect(); - if ( rect.width || rect.height ) { + if (rect.width || rect.height) { const doc = element.ownerDocument; const docElem = doc.documentElement; - return rect.top - docElem.clientTop; + return rect.top - docElem.clientTop; } return rect.top; @@ -43,7 +43,7 @@ export type Section = { section: any; }; -export function scrollTo(href, offsetTop = 0, target = getDefaultTarget, callback = () => {}) { +export function scrollTo(href: string, offsetTop = 0, target = getDefaultTarget, callback = () => { }) { const scrollTop = getScroll(target(), true); const targetElement = document.getElementById(href.substring(1)); if (!targetElement) { @@ -68,7 +68,7 @@ export function scrollTo(href, offsetTop = 0, target = getDefaultTarget, callbac class AnchorHelper { private links: Array; - private currentAnchor: HTMLElement | null; + private currentAnchor: HTMLAnchorElement | null; private _activeAnchor: string; constructor() { @@ -77,17 +77,17 @@ class AnchorHelper { this._activeAnchor = ''; } - addLink(link) { + addLink(link: string) { if (this.links.indexOf(link) === -1) { this.links.push(link); } } - getCurrentActiveAnchor(): HTMLElement | null { + getCurrentActiveAnchor(): HTMLAnchorElement | null { return this.currentAnchor; } - setActiveAnchor(component) { + setActiveAnchor(component: HTMLAnchorElement) { this.currentAnchor = component; } @@ -98,21 +98,21 @@ class AnchorHelper { } const linksPositions = (this.links - .map(section => { - const target = document.getElementById(section.substring(1)); - if (target && getOffsetTop(target) < offsetTop + bounds) { - const top = getOffsetTop(target); - if (top <= offsetTop + bounds) { - return { - section, - top, - bottom: top + target.clientHeight, - }; + .map(section => { + const target = document.getElementById(section.substring(1)); + if (target && getOffsetTop(target) < offsetTop + bounds) { + const top = getOffsetTop(target); + if (top <= offsetTop + bounds) { + return { + section, + top, + bottom: top + target.clientHeight, + }; + } } - } - return null; - }) - .filter(section => section !== null) as Array
); + return null; + }) + .filter(section => section !== null) as Array
); if (linksPositions.length) { const maxSection = linksPositions.reduce((prev, curr) => curr.top > prev.top ? curr : prev); @@ -121,7 +121,7 @@ class AnchorHelper { return ''; } - scrollTo(href, offsetTop, target = getDefaultTarget, callback = () => {}) { + scrollTo(href: string, offsetTop: number | undefined, target = getDefaultTarget, callback = () => { }) { scrollTo(href, offsetTop, target, callback); } } diff --git a/components/anchor/index.tsx b/components/anchor/index.tsx index 4b9150eece..5a2d39713b 100644 --- a/components/anchor/index.tsx +++ b/components/anchor/index.tsx @@ -39,7 +39,7 @@ export default class Anchor extends React.Component { private anchorHelper: AnchorHelper; private _avoidInk: boolean; - constructor(props) { + constructor(props: AnchorProps) { super(props); this.state = { activeAnchor: null, @@ -85,7 +85,7 @@ export default class Anchor extends React.Component { } } - clickAnchorLink = (href, component) => { + clickAnchorLink = (href: string, component: HTMLElement) => { this._avoidInk = true; this.refs.ink.style.top = `${component.offsetTop + component.clientHeight / 2 - 4.5}px`; this.anchorHelper.scrollTo(href, this.props.offsetTop, getDefaultTarget, () => { @@ -93,10 +93,10 @@ export default class Anchor extends React.Component { }); } - renderAnchorLink = (child) => { - + renderAnchorLink = (child: React.ReactElement) => { const { href } = child.props; - if (child.type.__ANT_ANCHOR_LINK && href) { + const { type } = child as any; + if (type.__ANT_ANCHOR_LINK && href) { this.anchorHelper.addLink(href); return React.cloneElement(child, { onClick: this.clickAnchorLink,