时间戳

首页 > 解决方案 > Svelte 如何捕获浏览器后退按钮或卸载？

svelte - Svelte 如何捕获浏览器后退按钮或卸载？

问题描述

我想在我的 Svelte SPA 应用程序中完全控制导航。

有没有办法捕获后退、前进和刷新按钮，以便我可以发出有关丢失页面的警告？

标签： svelteonbeforeunloadsvelte-component

解决方案

假设您没有使用 Sapper 或第三方 Svelte 路由库，您可以beforeunload按照评论中的建议来实现。这是一个带有 TypeScript 的片段。

<script lang="ts">
    export let name: string;

    function beforeunload(event: BeforeUnloadEvent) {
        event.preventDefault();
        return event.returnValue = '';
    }
</script>

<p>{name}</p>

<svelte:window on:beforeunload={beforeunload}/>

on:beforeunload可能会引发类型错误，但它应该可以正常工作。

推荐阅读