Skip to content

使用畫布

PageFlow 畫布用來探索路由圖,而不是編輯應用資料。

移動與縮放

  • 捲動或使用觸控板,以指標為中心縮放。
  • 拖動畫布空白區域來移動視窗。
  • 選擇頁面卡片,使其聚焦並顯示相關關係。
  • 使用瀏覽器視窗控制項,比較手機和桌面預覽。

聚焦頁面

選擇頁面後,與它相連的頁面會進入視野,選中的預覽會提升為即時 iframe,並顯示導航熱點。當完整圖包含太多額外資訊時,聚焦視圖特別實用。

探索路由群組

具有共同路徑片段的路由可能顯示為卡組。開啟卡組以查看下一層。PageFlow 會保留目前群組的麵包屑,並以動畫在層級間切換,讓目前脈絡保持清晰。

閱讀連接關係

連接具有方向。向外的連線表示來源頁面包含前往目標頁面的已知方式。沒有連線並不總代表無法導航:計算出的目標只有在應用公開後才會被發現。

更新預覽

PageFlow 在有限佇列中重新擷取過期頁面。選中的頁面和可見頁面具有較高優先級。路由與連結變更透過 HMR 傳遞,現有縮圖會一直保留到新縮圖準備完成。

使用技巧

  • 從首頁或主要入口路由開始。
  • 在大型應用中,每次只進入一個路由群組。
  • 聚焦初始化時會寫入資料的頁面前,先使用測試資料。
  • 如果頁面一直未能就緒,請加入明確的就緒訊號

基於 MIT 授權條款發佈。