indexArray

indexArray reactively maps an array by index.

Import

import { indexArray } from "solid-js";

Type

function indexArray<T, U>(
  list: () => readonly T[] | undefined | null | false,
  mapFn: (value: () => T, index: number) => U,
  options?: { fallback?: () => any }
): () => U[];

Parameters

list

• Type: () => readonly T[] | undefined | null | false
• Required: Yes

Accessor that returns the source array.

mapFn

• Type: (value: () => T, index: number) => U
• Required: Yes

Mapping function for each index.

options

fallback

• Type: () => any

Fallback accessor used when the source array is empty or falsy. The mapped result becomes a single fallback entry.

Return value

• Type: () => U[]

Returns an accessor for the mapped array.

Behavior

• Items are mapped by index rather than by value identity.
• The item argument is an accessor.
• The index argument is a number.
• Updating an item at the same index updates the corresponding mapped result.
• Reordering the source array changes which item each index points to instead of moving mapped entries by identity.
• This is the underlying helper for <Index>.

Examples

Map an array by index

import { createSignal, indexArray } from "solid-js";

const [source] = createSignal([{ status: "pending" }, { status: "done" }]);

const mapped = indexArray(source, (item, index) => ({
  index,
  status: () => item().status,
}));

Related

• <Index>
• mapArray