How to describe TS interface for history.goBack in React?

Viewed 57

Could help me please to type history.goBack in React? At the moment I use type any but I think its a wrong way.

Main.tsx

...
<Route path={PAGE_404} component={Page404} />

Page404.tsx

const Page404: React.FC<RouteComponentProps> = ({ history }) => {
  return (
    <section className={styles.section}>
      <GoBackLink text={'Назад'} onGoBackClick={() => history.goBack()} />
          ...
      </div>
    </section>
  );
};

export default Page404;

GoBackLink.tsx with interface and type any for onGoBackClick key

interface IGoBackLinkProps {
  text: string;
  onGoBackClick: any;
}

const GoBackLink: React.FC<IGoBackLinkProps> = ({ text, onGoBackClick }) => {
  return (
    <Link className={styles.link} to='/' onClick={onGoBackClick}>
      {text}
    </Link>
  );
};

export default GoBackLink;
2 Answers

You can use onGoBackClick: () => void or onGoBackClick: Function

interface IGoBackLinkProps {
  text: string;
  onGoBackClick(): void;
}

...if you don't need any parameters and don't care about return value in this callback function.

Related