Loading source
Pulling the file list, source metadata, and syntax-aware rendering for this listing.
Source from repo
Apply VueUse composables in Vue 3/Nuxt projects to replace custom implementations with battle-tested utilities.
Files
Skill
Size
Entrypoint
Format
Open file
Syntax-highlighted preview of this file as included in the skill package.
references/useArrayFindIndex.md
1---2category: Array3---45# useArrayFindIndex67Reactive `Array.findIndex`89## Usage1011### Use with array of multiple refs1213```ts14import { useArrayFindIndex } from '@vueuse/core'1516const item1 = ref(0)17const item2 = ref(2)18const item3 = ref(4)19const item4 = ref(6)20const item5 = ref(8)21const list = [item1, item2, item3, item4, item5]22const result = useArrayFindIndex(list, i => i % 2 === 0)23// result.value: 024item1.value = 125// result.value: 126```2728### Use with reactive array2930```ts31import { useArrayFindIndex } from '@vueuse/core'3233const list = ref([0, 2, 4, 6, 8])34const result = useArrayFindIndex(list, i => i % 2 === 0)35// result.value: 036list.value.unshift(-1)37// result.value: 138```3940## Type Declarations4142```ts43export type UseArrayFindIndexReturn = ComputedRef<number>44/**45* Reactive `Array.findIndex`46*47* @see https://vueuse.org/useArrayFindIndex48* @param list - the array was called upon.49* @param fn - a function to test each element.50*51* @returns the index of the first element in the array that passes the test. Otherwise, "-1".52*53* @__NO_SIDE_EFFECTS__54*/55export declare function useArrayFindIndex<T>(56list: MaybeRefOrGetter<MaybeRefOrGetter<T>[]>,57fn: (element: T, index: number, array: MaybeRefOrGetter<T>[]) => unknown,58): UseArrayFindIndexReturn59```60