什么是Router？

@beforesemicolon/router 是基于 Web Component 的路由解决方案，适用于需要客户端导航而不采用框架路由器的单页面应用程序、多页面应用程序和混合站点。

它使用自定义元素，因此路由与其控制的视图位于相同的 HTML 结构中。您可以从静态标记开始，随着应用程序的增长添加惰性路由文件，并且仅在需要防护、分析、编程导航或捆绑器集成时才使用 JavaScript API。

执行模型

路由器通过中央匹配引擎解析页面激活：

• 单一匹配器： 每个导航事件都会解析和匹配 URL 一次。
• 统一守卫： 全局和特定于路线的守卫每次转换只运行一次，避免冗余检查。
• 外科手术通知： 仅通知受 URL 更改影响的路由感知元素，从而防止不必要的重新渲染。
• 缓存重新安装： 当路由变为非活动状态时，其 DOM 节点将被分离并保留在内存中。向后导航会立即重新装载缓存的内容，而不是重新创建它。

主要特点

• 声明式导航： 通过 <page-link> 标签更改页面并更新文档标题。
• 路径匹配： 使用 <page-route> 和动态参数（例如 :id）加载内联视图或外部路径文件。
• 搜索参数渲染： 使用 <page-route-query> 干净地响应 URL 查询字符串。
• 智能回退： 使用 <page-redirect> 设置默认位置或捕获所有 404 页面。
• 元数据可访问性： 使用 <page-data> 立即访问路径名参数、查询值或状态负载详细信息。
• 高级控制： 使用异步路由防护保护路由，在历史和哈希路由模式之间交换，并与模块捆绑器集成。