React Prompt组件 阻止用户离开页面

import { Prompt } from "react-router-dom";

const Login = () => {
  return (
    <>
      <Prompt
        message={(location, action) => {
          // 返回 true 表示不拦截, 你可也检查当前页面数据，提示用户是否放弃填写的数据
          return true; 

          // 返回 string 会提示用户，让用户选择是否离开
          return `Are you sure you want to go to ${location.pathname}?`;
        }}
      />

      <Link2 to={"/home"}>To Home</Link2> 
    </>
  );
};

用户可以通过浏览器导航，Prompt 将无法拦截

See also:

• https://reactrouter.com/core/api/Prompt