Weber更新日誌

組件概述

導航條是網站頁面頂部的導航集成組件。支持PC與移動端兩種布局，移動端會自動折疊為漢堡選單。

適用場景

1、網站頂部主導航，放置各子頁面跳轉入口

2、多頁面共用導航（可儲存為全局區塊，一次修改全站生效）

不建議使用場景

1. 頁面中間段落內的小型連結組：不需要完整漢堡選單結構，建議改用【鏈接塊+文本】、【文本連結】。

2. 頁面底部導航：不需要漢堡折疊功能，建議直接使用【網格 + 連結塊 + 文本】搭建。

注意事項

1. 導航條為複合容器組件，內部可新增子組件（圖標、按鈕、菜單、下拉菜單等），不能刪除根層結構，避免出Bug（初始下的導航條組件只允許刪除【菜單】組件，其他均不允許）

2. 所有添加的下拉、超級下拉、全屏下拉必須放置在【菜單】層級內。（菜單組件層級涵蓋 菜單項、下拉、超級下拉、全屏下拉）

3. 如果要固定導航，則需要在導航最外層的【區域】層設置樣式。（例如：選中【區域】層，在Class中打開【位置】設置，然後選中【Sticky】滾動固定樣式，再在【偏移】的單獨設置中將【上】的數值設置成【0】。最後注意設置【圖層堆疊順序】，避免導航被遮擋。數值越高，層級越高）

組件使用

1、導航條內可以添加菜單、下拉、超級下拉、全屏下拉、圖標、按鈕等組件，但注意如果在移動端需要全部折疊成漢堡，則需要將添加的組件放置於【折疊容器】層級內。

2、導航條的折疊漢堡可以在編輯器右側的【設置】中選擇開啟的端口

3、導航條的菜單項可以設置選中樣式，選中【導航欄】層級，在【設置】中調整【菜單選中樣式】。

（注意：① 支持各端口選中樣式不同    ② 如選中樣式有背景色等，選中後背景顏色會在【鏈接】層級顯示，注意設置【內部留白】）

4、如要設置懸浮交互樣式，則需要單獨在每一個【菜單項】層級設置，與選中樣式設置不衝突

5、當導航條內的菜單項過多，在不同端口顯示器會有內容超出菜單的情況。可以選擇在【設置】中勾選【左右滑動】功能，可以放置菜單項超出規定範圍

6、如導航條添加了【按鈕】組件，但在移動端不想【按鈕】被折疊進漢堡內，則需要將【按鈕】組件放置在【滾動容器】層級外（即與【滾動容器】同一層級）

7、導航條的logo 為【圖片】組件嵌入，雙擊可替換，在【圖片】上一層【連結塊】可以設置跳轉鏈接