Skip to main content

DataTable

Function DataTable 

Source
pub fn DataTable<T: Clone + PartialEq + 'static>(
    props: DataTableProps<T>,
) -> Element
Expand description

Data Table organism component

§Example

use dioxus_ui_system::organisms::{DataTable, TableColumn, ColumnAlign};

#[derive(Clone, PartialEq)]
struct User {
    id: String,
    name: String,
    email: String,
}

let columns = vec![
    TableColumn {
        key: "name".to_string(),
        header: "Name".to_string(),
        width: None,
        align: ColumnAlign::Left,
        sortable: true,
        render: None,
    },
    TableColumn {
        key: "email".to_string(),
        header: "Email".to_string(),
        width: None,
        align: ColumnAlign::Left,
        sortable: true,
        render: None,
    },
];

let data = vec![
    User { id: "1".to_string(), name: "John".to_string(), email: "john@example.com".to_string() },
];

rsx! {
    DataTable {
        columns: columns,
        data: data,
        key_extractor: |u| u.id.clone(),
    }
}