如何在SvelteKit中以编程方式路由?

我希望能够管理我的 SvelteKit 应用程序的历史记录,同时确保 SvelteKit 的整个路由系统不会受到任何影响。

就像是:

function routeToPage(route: string) {
   router.push(`/${route}`) // equivalent of this function
}

回答

您可以使用goto 函数以编程方式导航到 Svelte-Kit 中的路线。最简单的实现是这样的:

<script> 
  import { goto } from '$app/navigation';
  goto("/route")
</script>

但是您也可以使用更高级的选项,这些选项将作为目标路由的第二个参数传递。


回答

感谢来自 SvelteKit Discord 的 Theo 回答我自己的问题:

使用https://kit.svelte.dev/docs#modules-$app-navigation。

import { goto } from '$app/navigation';

function routeToPage(route: string, replaceState: boolean) {
   goto(`/${route}`, { replaceState }) 
}

replaceState == true将替换路由而不是添加到浏览器历史记录中。因此,当您单击返回时,您将不会回到原来的路线。

回去使用History API。

import { goto } from '$app/navigation';

function goBack(defaultRoute = '/home') {
  const ref = document.referrer;
  goto(reflength > 0 ? ref : defaultRoute)
}


以上是如何在SvelteKit中以编程方式路由?的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>