Struct patternfly_yew::components::table::Table

pub struct Table<C, M>
where
    C: Clone + Eq + 'static,
    M: PartialEq + TableModel<C> + 'static,
{ /* private fields */ }

Table component

A table is used to display large data sets that can be easily laid out in a simple grid with column headers.

See: https://www.patternfly.org/components/table/html

Properties

Defined by TableProperties.

Usage

The table component is a more complex component than most others. It is recommended to check out the more complete examples in the quickstart project: https://github.com/patternfly-yew/patternfly-yew-quickstart/tree/main/src/components/table.

Summarizing it, you will need:

• A type defining the column/index (this can be an enum or a numeric like usize).
• A type defining an item/entry/row.
• Let the item type implement TableEntryRenderer.
• Create a table state model (e.g. using MemoizedTableModel).
• Wire up the table state model (e.g. using use_table_data).

Example

use yew::prelude::*;
use patternfly_yew::prelude::*;

#[derive(Copy, Clone, Eq, PartialEq)]
enum Column { First, Second };
struct ExampleEntry { foo: String };

impl TableEntryRenderer<Column> for ExampleEntry {
  fn render_cell(&self, context: CellContext<'_, Column>) -> Cell {
    match context.column {
      Column::First => html!(&self.foo).into(),
      Column::Second => html!({self.foo.len()}).into(),
    }
  }
}

#[function_component(Example)]
fn example() -> Html {

  let entries = use_memo((), |()| {
      vec![
          ExampleEntry { foo: "bar".into() },
          ExampleEntry {
              foo: "Much, much longer foo".into(),
          },
      ]
  });

  let (entries, _) = use_table_data(MemoizedTableModel::new(entries));

  let header = html_nested! {
    <TableHeader<Column>>
      <TableColumn<Column> label="foo" index={Column::First} />
      <TableColumn<Column> label="bar" index={Column::Second} />
    </TableHeader<Column>>
 };

  html! (
    <Table<Column, UseTableData<Column, MemoizedTableModel<ExampleEntry>>>
      {header}
      {entries}
    />
  )
}

Trait Implementations

impl<C, M> BaseComponent for Table<C, M>

where C: Clone + Eq + 'static, M: PartialEq + TableModel<C> + 'static, Self: 'static,

type Message = ()

The Component’s Message.

type Properties = TableProperties<C, M>

The Component’s Properties.

fn create(ctx: &Context<Self>) -> Self

Creates a component.

fn update(&mut self, _ctx: &Context<Self>, _msg: Self::Message) -> bool

Updates component’s internal state.

fn changed( &mut self, _ctx: &Context<Self>, _old_props: &Self::Properties ) -> bool

React to changes of component properties.

fn view(&self, ctx: &Context<Self>) -> HtmlResult

Returns a component layout to be rendered.

fn rendered(&mut self, _ctx: &Context<Self>, _first_render: bool)

Notified after a layout is rendered.

fn destroy(&mut self, _ctx: &Context<Self>)

Notified before a component is destroyed.

fn prepare_state(&self) -> Option<String>

Prepares the server-side state.

impl<C, M> Debug for Table<C, M>

where C: Clone + Eq + 'static, M: PartialEq + TableModel<C> + 'static,

fn fmt(&self, f: &mut Formatter<'_>) -> Result

Formats the value using the given formatter.

impl<C, M> FunctionProvider for Table<C, M>

where C: Clone + Eq + 'static, M: PartialEq + TableModel<C> + 'static,

type Properties = TableProperties<C, M>

Properties for the Function Component.

fn run(ctx: &mut HookContext, props: &Self::Properties) -> HtmlResult

Render the component. This function returns the Html to be rendered for the component.