<For> / forEach

Render content for each value in an iterable expression keyed by value.

JSXNo Build

import { For } from "rvx";

<For each={someIterable}>
    {value => <li>{value}</li>}
</For>

import { forEach, e } from "./rvx.js";

forEach(someIterable, value => e("li").append(value))

Index

A function to reactively access the current index is passed as the second argument:

JSXNo Build

<For each={someIterable}>
    {(value, index) => <li>{() => index() + 1}: {value}</li>}
</For>

forEach(someIterable, (value, index) => e("li").append(() => index() + 1, ": ", value))

Error Handling

Errors thrown by the component or while updating an index result in undefined behavior.