// Inside a view; c is *ui.Context, t is nui.Theme.
// Keep s (example state) outside the view. See the complete example.
nui.NavigationMenu(c.Key("navigation"), t, &s.Active, &s.Navigation, []nui.NavigationItem{{ID: "home", Label: "Overview", Icon: lucide.House()}, {ID: "projects", Label: "Projects", Icon: lucide.Folder()}, {ID: "settings", Label: "Settings", Icon: lucide.Settings()}}, nui.NavigationOptions{Label: "Workspace", Vertical: false, Compact: false})
ui.Textf(c, "Active: %s", s.Active)

使用说明

切换 Overview、Projects 与 Settings 查看当前 ID，再比较纵向与紧凑布局。NavigationMenu 负责选择与呈现，实际页面内容由应用随 Active ID 更新。

API 参考

NavigationOptions

源码

type NavigationOptions struct {
	Label             string
	Vertical, Compact bool
	OnNavigate        func(string)
	Decoration
}

字段	类型	说明
`Label`	`string` Go 零值: `""`	控件标签或可访问名称。
`Vertical`	`bool` Go 零值: `false`	启用纵向排列。
`Compact`	`bool` Go 零值: `false`	使用紧凑布局。
`OnNavigate`	`func(string)` Go 零值: `nil`	激活导航项目时通知应用的回调。
`UI`	`Styles` Go 零值: `zero value`	以部件名称为键覆盖外观和间距。
`Style`	`func(Slot, ui.Element)` Go 零值: `nil`	同步配置当前构建的部件；不要保留 Element。

NavigationItem

源码

type NavigationItem struct {
	ID, Label, Description, Group string
	Icon                          *ui.SVG
	Disabled                      bool
	Children                      []NavigationItem
}

字段	类型	说明
`ID`	`string` Go 零值: `""`	唯一且稳定的业务标识。
`Label`	`string` Go 零值: `""`	控件标签或可访问名称。
`Description`	`string` Go 零值: `""`	补充说明文字。
`Group`	`string` Go 零值: `""`	项目分组名称。
`Icon`	`*ui.SVG` Go 零值: `nil`	组件使用的 SVG 图标。
`Disabled`	`bool` Go 零值: `false`	禁用组件及其交互。
`Children`	`[]NavigationItem` Go 零值: `nil`	子项目列表。

NavigationMenu

实时预览

参数配置

NavigationMenuItems

NavigationOptions

Go 代码

使用说明

API 参考

NavigationMenu

NavigationOptions

NavigationItem