svelte-spa-router 使用导航守卫

Svelte-spa-router 也支持导航守卫来控制路由跳转的行为。你可以通过 `router.beforeEach` 方法来定义全局的导航守卫，也可以在每个路由配置项中定义局部的导航守卫。

全局导航守卫示例：

import { Router } from 'svelte-spa-router'
import App from './App.svelte'

Router.beforeEach((route, redirect) => {
  // 在这里做一些判断逻辑，比如验证用户是否登录等
  // 如果需要跳转到其他路由，调用 redirect('/path') 方法
  // 如果不需要跳转，不调用 redirect 方法即可
})
 
const app = new App({
  target: document.body,
  props: {
    name: 'world'
  }
})

局部导航守卫示例：

import { Router } from 'svelte-spa-router'
import Home from './Home.svelte'

const routes = [
  {
    path: '/',
    component: Home,
    beforeRouteUpdate(to, from, next) {
      // 在这里做一些判断逻辑，比如验证用户是否登录等
      // 如果需要跳转到其他路由，调用 next('/path') 方法
      // 如果不需要跳转，调用 next() 方法即可
      next()
    }
  },
  // ...
]

const app = new App({
  target: document.body,
  props: {
    name: 'world'
  }
})

Router.useRoutes(routes)

需要注意的是，在导航守卫中，如果需要跳转到其他路由，需要调用 `redirect('/path')` 方法，否则路由跳转将被阻止。如果不需要跳转，不调用 `redirect` 方法即可。