函数 unstable_usePrompt

unstable_usePrompt 是 useBlocker 的包装器，用于向用户显示 window.confirm 提示，而不是使用 useBlocker 构建自定义 UI。

unstable_ 标志将不会被移除，因为这项技术有很多缺陷，并且当用户在确认框打开时点击额外的后退/前进导航时，在不同浏览器中的行为非常不同（有时甚至不正确）。使用风险自负。

function ImportantForm() {
  let [value, setValue] = React.useState("");

  // Block navigating elsewhere when data has been entered into the input
  unstable_usePrompt({
    message: "Are you sure?",
    when: ({ currentLocation, nextLocation }) =>
      value !== "" &&
      currentLocation.pathname !== nextLocation.pathname,
  });

  return (
    <Form method="post">
      <label>
        Enter some important data:
        <input
          name="data"
          value={value}
          onChange={(e) => setValue(e.target.value)}
        />
      </label>
      <button type="submit">Save</button>
    </Form>
  );
}
Copy