useNavigate

useNavigate是一个使用比较频繁的Hook,它可以返回一个导航函数,用于在代码中执行程序导航。毕竟程序导航操作也是应用导航动作除用户点击触发导航以外的另一大动作触发器。useNavigate的函数签名如下。

interface NavigateFunction {
  (to: To, options?: { replace: boolean; state?: any }): void;
  (delta: number): void;
}

declare function useNavigate(): NAvigateFunction;

例如在应用的登录表单中就经常会使用到这种程序导航功能。

function LoginForm() {
  let navigate = useNavigate();

  let handleSubmit = async function (event) {
    event.preventDefault();
    await submitForm(event.target);
    navigate('../home', { replace: true });
  };

  return <form obSubmit={handle}></form>;
}