NUI / Components / Scroll, Lists & Data

ForEach

ImplementedScroll, Lists & Data

ForEach repeats entries from inline item data or a named data source.

Supported as a data repetition helper.

Overview

ForEach repeats entries from inline item data or a named data source.

When to use

Use ForEach when the source should read as a declarative repetition surface rather than a list-view control.

Children

Uses data/template fields instead of normal children.

Basic syntax

nui

ForEach RewardEntries {
    items: "gold|Gold|100;xp|XP|50"
}

Supported properties

Property	Type	Required	Default	Description
`items`	string	No	Empty	Inline item data.
`dataSource`	string	No	Empty	Named external data source.
`itemKey`	string	No	Empty	Field or static key binding.
`itemText`	string	No	Empty	Field or static display text binding.
`itemValue`	string	No	Empty	Field or static value binding.
`itemCommand`	string	No	Empty	Command when an entry is used.
`layout`	enum	No	vertical	Entry layout mode.
`entryWidth`	number	No	Default	Entry width.
`entryHeight`	number	No	Default	Entry height.
`entrySpacing`	number	No	0	Space between entries.
`gap`	number	No	0	Space between generated entries.
`width`	number	No	Auto	Desired width.
`height`	number	No	Auto	Desired height.
`visible`	bool	No	true	Visibility flag.

Contextual properties

Contextual property rules

ForEach may receive stack, canvas, grid, wrap, or ExpandableArea slot properties only when it is authored as a direct child of the matching parent. It does not support normal authored child nodes.

Full syntax example

nui

ForEach RewardEntries {
    items: "gold|Gold|100;xp|XP|50"
    itemKey: "id"
    itemText: "label"
    itemValue: "amount"
    itemCommand: "ClaimReward"
    layout: vertical
    entryWidth: 180
    entryHeight: 32
    entrySpacing: 6
    gap: 6
    width: 320
    height: 160
    visible: true
}

Limitations

Normal children { ... } blocks are not public syntax for this component.
Use ListView or TileView when selection, scrolling, or list behavior is required.