基本概念
PageFlow 会把应用路由和导航目标转换成一张可探索的关系图。理解下面五个概念,就能快速上手。
页面
页面代表一个可以被 PageFlow 渲染的具体路由。静态路由可以直接渲染;动态路由需要先提供有代表性的参数值。
每个页面可以包含标题、路径、实时预览、缩略图、导航连接和关联测试。Query 与 Hash 可以记录更具体的访问位置,而不必生成新的路由定义。
导航连接
连接表示从一个页面指向另一个页面的关系。PageFlow 可以发现框架链接、同源 <a>、字面量程序式跳转、History 导航,以及 data-pageflow-to 等显式提示。
运行时计算的目标地址,可能要等相关交互发生后才能被发现。
导航热点
选择页面后,PageFlow 会高亮能够触发已知导航的元素。热点把真实界面与关系图连接起来,让你看到跳转从页面中的什么位置发生。
实时预览与缩略图
当前选中的页面使用同源实时 iframe。其他附近页面使用捕获后的预览,以保持画布流畅。旧缩略图会在后台刷新期间继续显示。
路由组
大型路由树会折叠成页面组。进入页面组可查看下一层路由,再通过面包屑返回上级。分组能减少视觉噪音,同时保留页面关系。