useLeaveGuard
当表单存在未保存的修改时，在关闭标签页或刷新页面时发出提醒。提交过程中以及成功保存后不会打扰用户。
签名
ts
function useLeaveGuard(form: Form, options?: LeaveGuardOptions): () => void| 选项 | 说明 |
|---|---|
onBeforeRouteLeave | 来自 vue-router 的 onBeforeRouteLeave 函数 —— 传入后应用内跳转时也会提醒 |
confirm | 应用内跳转时使用的自定义确认框：(message) => boolean | Promise<boolean>。默认为 window.confirm |
message | 应用内跳转时的提问文本 |
返回一个用于移除关闭页面提醒的函数。在组件中无需调用 —— 会自动移除。
关闭标签页时浏览器会显示自己的标准提示 —— 文本无法修改。
示例
ts
import { onBeforeRouteLeave } from 'vue-router';
useLeaveGuard(form, {
onBeforeRouteLeave,
confirm: (message) => dialog.confirm({ title: message }), // e.g. a UI library dialog returning Promise<boolean>
message: 'Leave without saving?',
});