sly-svelte-router
TypeScript icon, indicating that this package has built-in type declarations

1.0.31 • Public • Published

sly-svelte-spa-router

A SPA router for Svelte based on the History API.

How it works

  1. Router initialization:

    • The createRouter function sets up the router with provided routes and configurations.
    • It adds event listeners for routing changes and popstate events.
    • Initializes the first route based on the current URL.
  2. Route changes:

    • Routes can be changed using goTo, goNext, goPrev functions, or link and route directives.
    • These trigger custom events ('routing-changed' or 'routing-url-changed').
  3. Route processing:

    • When a route change is requested, the router checks for restrictions.
    • If restricted, it redirects to an allowed route.
  4. Route rendering:

    • The Router.svelte component renders the current route component.
    • It also updates the document title and handles slot content.
  5. History management:

    • The router uses the History API to manage browser history.
    • It pushes or replaces state depending on the navigation action.
  6. Restrictions:

    • Routes can have restrictions that are checked before navigation.
    • Custom restriction resolvers can be provided to handle complex logic.

Key Components

  • Router.svelte: Main component for rendering routes.
  • createRouter: Function to initialize the router.
  • link and route directives: For declarative routing in templates.
  • goTo, goNext, goPrev: Programmatic navigation functions.

DISCONTINUED

This project is no longer maintained. For an updated and improved version, please check out sly-svelte-location-router.

Package Sidebar

Install

npm i sly-svelte-router

Weekly Downloads

8

Version

1.0.31

License

MIT

Unpacked Size

26.4 kB

Total Files

6

Last publish

Collaborators

  • slyotis