ENGINEERING UI CATALOG
按鈕
主要操作、單選狀態與可選下拉行為。所有範例都可直接互動。
UIButtonPageBottom頁面操作按鈕
用於頁面底部的主要與次要操作,內容由預設 slot 提供。
尚未操作
查看使用方式
<UIButtonPageBottom variant="primary">確認預約</UIButtonPageBottom>UIButtonIconBlock圖示區塊按鈕
適合總覽或功能入口,可傳入標題、次標題、說明、圖示與前往位置。
查看使用方式
<UIButtonIconBlock title="圖片" subtitle="2 個元件" description="圖片上傳與顯示。" :icon="Images" to="/UI/images" />UIButtonPageTab展示頁頁籤
用於 UI 展示頁分類導覽;active 狀態會標示目前頁面並自動捲入可視範圍。
查看使用方式
<UIButtonPageTab title="按鈕" to="/UI/buttons" active />UIButtonChoice選項按鈕
提供 default、selected、disabled 三種狀態,使用 select event 更新選擇。
查看使用方式
<UIButtonChoice text="下午" state="selected" @select="selectPeriod" />UIButtonNavMenu導覽/下拉按鈕
文字、圖示、點擊函式與下拉設定均可自訂;項目可設定為危險色。
查看使用方式
<UIButtonNavMenu text="王小明" :icon="UserRound" has-dropdown :dropdown="menuConfig" />