Accordion

组织可展开的多个内容区段。

实时预览

正在加载预览…

参数配置

多选 multiple否禁用 disabled否允许全部折叠 collapsible

全部字段 8

AccordionItems

列表项 · 2

AccordionItem

ID

Label

Icon

Disabled

Content

AccordionItem

ID

Label

Icon

Disabled

Content

AccordionOptions

Multiple

Disabled

KeepMounted

Collapsible

OnChange

UI

Styles · 0

Style

Go 代码

// Inside a view; c is *ui.Context, t is nui.Theme.
// Keep s (example state) outside the view. See the complete example.
nui.Accordion(c.Key("accordion"), t, &s.Open, []nui.AccordionItem{{ID: "install", Label: "Installation", Content: func(c *ui.Context, t nui.Theme) { ui.Text(c, "go get github.com/josexy/nuxt-ui-go") }}, {ID: "usage", Label: "Usage", Content: func(c *ui.Context, t nui.Theme) { ui.Text(c, "Create a window and pass a theme to components.") }}}, nui.AccordionOptions{Multiple: false, Disabled: false, Collapsible: nui.Optional[bool]{}})

使用说明

展开 Installation 与 Usage，比较 Multiple 和 Collapsible 的组合。每项用稳定 ID 关联打开状态；内容回调只负责当前构建。

API 参考

Accordion

源码

func Accordion(c *ui.Context, t Theme, open *[]string, items []AccordionItem, o AccordionOptions) ui.Element

AccordionOptions

源码

type AccordionOptions struct {
	Multiple, Disabled, KeepMounted bool
	Collapsible                     Optional[bool]
	OnChange                        func()
	Decoration
}

字段	类型	说明
`Multiple`	`bool` Go 零值: `false`	允许选择多个项目。
`Disabled`	`bool` Go 零值: `false`	禁用组件及其交互。
`KeepMounted`	`bool` Go 零值: `false`	隐藏时保留内容及其控件状态。
`Collapsible`	`Optional[bool]` Go 零值: `unset`	允许关闭所有手风琴区段。
`OnChange`	`func()` Go 零值: `nil`	值发生变化时通知应用的回调。
`UI`	`Styles` Go 零值: `zero value`	以部件名称为键覆盖外观和间距。
`Style`	`func(Slot, ui.Element)` Go 零值: `nil`	同步配置当前构建的部件；不要保留 Element。