共用方式為


Breadcrumb 控制

用來提供瀏覽的控制項。

Note

完整文件和原始程式碼可在 GitHub 程式碼元件存放庫中找到。

Breadcrumb 控制項。

描述

Breadcrumb 控件應用作 App 或 Site 中的導航輔助工具。 它們表示目前頁面在階層中的位置,並協助使用者了解它們相對於該階層的其餘部分的位置。 階層連結也提供對較該階層更高層級的一鍵存取。

此程式碼元件為 Fluent UI Breadcrumb 控制項提供了一個包裝函式,以便在畫布應用程式和自訂頁面中使用。

內容

索引鍵屬性

屬性 描述
SelectedKey 這表示選取的索引鍵。 當使用者與控制項互動時,會透過 OnChange 事件來更新此項。
Items 要呈現的動作項目

Items 性能

每個項目都使用下列結構描述來視覺化元件中的資料。

姓名 描述
ItemDisplayName 階層連結項目的顯示名稱
ItemKey 用於指示選擇哪個項目以及新增子項目時的索引鍵。 索引鍵必須是唯一的。
ItemClickable 設定為 False,以防特定的階層連結項目無法點擊。

範例 Power Fx 公式:

Table(
    {
        ItemKey: "1",
        ItemDisplayName: "General",
        ItemClickable: true
    },
    {
        ItemKey: "2",
        ItemDisplayName: "Document",
        ItemClickable: true
    }
)

樣式屬性

姓名 描述
Theme 接受使用 Fluent UI Theme Designer (windows.net) 產生的 JSON 字串。 將此留空將使用 Power Apps 定義的預設主題。 有關如何設定的指南,請參閱佈景主題
AccessibilityLabel 螢幕助讀程式 aria-label
MaxDisplayedItems 聯合前顯示的最大階層連結數。 如果為零,則會呈現所有的階層連結。
OverflowIndex 將折疊溢出專案的選擇性索引。 預設值為零。

事件屬性

姓名 描述
InputEvent 要傳送到控制項的事件。 例如 SetFocus。 請參閱下文。

行為

支援將 SetFocus 視為 InputEvent

設定「選取時」行為

使用組件的 OnSelect 屬性中的 Switch() 公式,透過參考控制項件選擇的 ItemKey 作為開關值,為每個項目設定特定的動作。

用 Power Fx 語言中的適當運算式替換 false 值。

因為此控制項是用來瀏覽的,所以邏輯動作是使用瀏覽功能 (理想情況下是使用已載入相關資料的相關畫面)。

  Switch( Self.Selected.ItemKey,
    /* Action for ItemKey 1 */
    "1", false,
    
    /* Action for ItemKey 2 */
    "2", false,
  
    /* Default action */
        false
  )

在控制項上設定焦點

當顯示新對話方塊,且預設焦點應在控制項上時,將需要明確設定焦點。

若要呼叫輸入事件,您可以將繫結至 Input Event 屬性的內容變數設定為以 SetFocus 開頭且後面跟著隨機元素的字串,以確保應用程式會將其偵測為變更。

範例 Power Fx 公式:

UpdateContext({ ctxResizableTextareaEvent:"SetFocus" & Text(Rand()) }));

然後,內容變數 ctxResizableTextareaEvent 會繫結至屬性 Input Event 屬性。

限制

此程式碼元件只能在畫布應用程式和自訂頁面中使用。