fn

useSorted

v0.0.14testeddemo

Reactive, stable sorted copy of an array. Mirrors Array.prototype.sort but never mutates the source by default and guarantees stable ordering.

Examples

ts
const list = ref([3, 1, 2]);
const sorted = useSorted(list); // [1, 2, 3]
ts
// custom compare function
const users = ref([{ age: 30 }, { age: 18 }]);
const byAge = useSorted(users, (a, b) => a.age - b.age);
ts
// sort the source in place
const list = ref([3, 1, 2]);
useSorted(list, { dirty: true });
// list.value is now [1, 2, 3]

Demo

Loading demo…

Signatures

ts
export function useSorted<T = unknown>(source: Ref<T[]>, compareFn?: UseSortedCompareFn<T>): Ref<T[]>;
ts
export function useSorted<T = unknown>(source: MaybeRefOrGetter<T[]>, compareFn?: UseSortedCompareFn<T>): ComputedRef<T[]>;
ts
export function useSorted<T = unknown>(source: Ref<T[]>, options?: UseSortedOptions<T>): Ref<T[]>;
ts
export function useSorted<T = unknown>(source: MaybeRefOrGetter<T[]>, options?: UseSortedOptions<T>): ComputedRef<T[]>;
ts
export function useSorted<T = unknown>(source: Ref<T[]>, compareFn?: UseSortedCompareFn<T>, options?: Omit<UseSortedOptions<T>, 'compareFn'>): Ref<T[]>;
ts
export function useSorted<T = unknown>(source: MaybeRefOrGetter<T[]>, compareFn?: UseSortedCompareFn<T>, options?: Omit<UseSortedOptions<T>, 'compareFn'>): ComputedRef<T[]>;

Type Parameters

T= unknown

Parameters

ParameterTypeDescription
sourceMaybeRefOrGetter<T[]>The source array (ref, getter, or plain array)
compareFnOrOptions?UseSortedCompareFn<T> | UseSortedOptions<T>
maybeOptions?Omit<UseSortedOptions<T>, 'compareFn'>

Returns

ComputedRef<T[]> | Ref<T[]>A computed sorted copy (default), or the source ref when dirty is true