Leptos-Use Guide

use_sorted

Reactive sort of iterable

Demo

Usage

use leptos::prelude::*;
use leptos_use::use_sorted;

#[component]
fn Demo() -> impl IntoView {
let source = vec![10, 3, 5, 7, 2, 1, 8, 6, 9, 4];
let sorted: Signal<Vec<i32>> = use_sorted(source); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

view! { }
}

You can also sort by key or with a compare function.

use leptos::prelude::*;
use leptos_use::{use_sorted_by, use_sorted_by_key};

#[derive(Clone, PartialEq)]
pub struct Person {
    pub name: String,
    pub age: u16,
}

#[component]
fn Demo() -> impl IntoView {
let source = vec![
    Person {
        name: "John".to_string(),
        age: 40,
    },
    Person {
        name: "Jane".to_string(),
        age: 20,
    },
    Person {
        name: "Joe".to_string(),
        age: 30,
    },
    Person {
        name: "Jenny".to_string(),
        age: 22,
    },
];

// sort by key
let sorted: Signal<Vec<Person>> = use_sorted_by_key(
    source.clone(),
    |person: &Person| person.age,
);

// sort with compare function
let sorted: Signal<Vec<Person>> = use_sorted_by(
    source,
    |p1: &Person, p2: &Person| p1.age.cmp(&p2.age),
);

view! { }
}

Please note that these two ways of sorting are equivalent.

Feature

This function is only available if the crate feature use_sorted is enabled

Source

SourceDemoDocs