Skip to content
These are temporary community docs. The official docs are in progress.Help improve them
Markless
Esc
↑↓navigate↵open⌘Jpreview
On this page

MARKLESS_REPEAT_KEY_IS_INDEX

An @for loop is keyed by its index, so row state follows the position and not the item.

Warning from the compiler, while it builds your .tsrx files.

What happened

This loop uses key i. If the list reorders, any row state and event wiring stay with the slot number, not with the item.

Markless prints the message, the reason, and a suggestion:

MARKLESS_REPEAT_KEY_IS_INDEX: key <indexName> identifies each row of <collectionSource> by its position, not by its data. If <collectionSource> reorders, inserts, or deletes, any row-local state, event wiring, and DOM reuse stay with the slot number.
The key is the identity root for a repeated graph scope; a positional key pins that scope to the slot, which is only correct when state genuinely belongs to the position.
Key by a stable field of the item when state belongs to the item, such as `@for (const <itemName> of <collectionSource>; key <itemName>.id)`. Keep `key <indexName>` when state should follow the slot.
https://markless.dev/errors/MARKLESS_REPEAT_KEY_IS_INDEX

Words in angle brackets change from case to case.

How to fix it

If items can move, key by a stable field like item.id. If state belongs to the slot, keep key i and silence the warning with a reason.

<ul>
	// markless-allow MARKLESS_REPEAT_KEY_IS_INDEX: the list never reorders
	@for (const item of items; index i; key i) {
		<li>{item}</li>
	}
</ul>

Where it comes from

@markless/compiler raises this code. Source:

Read how to read a Markless error, or go back to all error codes.

Was this page helpful?