pub fn use_tabular<C: Columns<R>, R: Row>(
columns: C,
rows: ReadSignal<Vec<R>>,
) -> TableData<C, R>Expand description
Creates a reactive table with the given columns and rows.
This is the main hook for setting up a table. It returns a TableData that can be used
with TableHeaders and TableCells components to render the table.
§Parameters
columns: A tuple of columns implementingTableColumnrows: A reactive signal containing the row data
§Example
use dioxus::prelude::*;
use dioxus_tabular::*;
fn app() -> Element {
let users = use_signal(|| vec![
User { id: 1, name: "Alice".to_string() },
User { id: 2, name: "Bob".to_string() },
]);
// Create table with single column
let data = use_tabular((NameColumn,), users.into());
rsx! {
table {
thead { tr { TableHeaders { data } } }
tbody {
for row in data.rows() {
tr { key: "{row.key()}", TableCells { row } }
}
}
}
}
}§Multiple Columns
// Use tuple for multiple columns (supports up to 12 columns)
let data = use_tabular((IdColumn, NameColumn), users.into());