Pagination

Pagination with page navigation, next and previous links.

Installation

The CLI is not yet available. For now, manually copy the component source into your project.

rust-shadcn-ui add pagination

Usage

use yew::prelude::*;

use crate::components::ui::pagination::{
    Pagination,
    PaginationContent,
    PaginationEllipsis,
    PaginationItem,
    PaginationLink,
    PaginationNext,
    PaginationPrevious,
};

#[component]
fn Usage() -> impl IntoView {
    view! {
        <Pagination>
            <PaginationContent>
            <PaginationItem>
                <PaginationPrevious href="#" />
            </PaginationItem>
            <PaginationItem>
                <PaginationLink href="#">{"1"}</PaginationLink>
            </PaginationItem>
            <PaginationItem>
                <PaginationEllipsis />
            </PaginationItem>
            <PaginationItem>
                <PaginationNext href="#" />
            </PaginationItem>
            </PaginationContent>
        </Pagination>
    }
}

Router

By default the <PaginationLink /> component will render an <a /> tag.

To use a router link component, make the following updates to pagination.rs:

+ use yew_router::prelude::*;

  html! {
-     <a>
+     <Link>
          // ...
-     </a>
+     </Link>
  }

See Also