React Typescript: add location state to react router component

Question

I have a normal route

function LoginPage(props: RouteComponentProps): React.ReactElement {...
}

that uses RouteComponentProps

Answer 1

You can use the useLocation() hook providing a generic type, this way you can override the unknown type set by default in location.state.

import { RouteComponentProps, useLocation } from 'react-router-dom';
import React from 'react';

interface stateType {
   from: { pathname: string }
}

const { state } = useLocation();

console.log(state.from)

It should work fine.