How to access data from location in react-router-dom 6

Working on forget password, I am trying to pass email data from login page to forget password page through Link.

But When I am trying to access the same in forget password, it is giving me undefine.

could you please check my syntax.

Below is the code snippet.

Below is the Login Page code

  <div className="forget-password-container">
          <div>
            {" "}
            <Link
              to={{
                pathname: "/forget-password",
                state: formData.email,
              }}
            >
              <u style={{ textDecoration: "underline" }}>Forget Password</u>
            </Link>
          </div>
          <div>

Forget Password Page.

    const ForgetPassword = (props) => {
      // const { email } = (props.location && props.location.state) || {};
      console.log(props?.location?.state);
      return <div>ForgetPassword </div>;
    };
    
    export default ForgetPassword;

Please suggest me how can I access data in forget password page