Component class abstract

Describes the configuration for an Element.

Components are the central class hierarchy in the Jaspr framework and have the same structure and purpose as widgets do in Flutter. A component is an immutable description of part of a user interface. Components can be inflated into elements, which manage the underlying DOM.

Components themselves have no mutable state (all their fields must be final). If you wish to associate mutable state with a component, consider using a StatefulComponent, which creates a State object (via StatefulComponent.createState) whenever it is inflated into an element and incorporated into the tree.

A given component can be included in the tree zero or more times. In particular a given component can be placed in the tree multiple times. Each time a component is placed in the tree, it is inflated into an Element, which means a component that is incorporated into the tree multiple times will be inflated multiple times.

The key property controls how one component replaces another component in the tree. If the runtimeType and key properties of the two components are operator==, respectively, then the new component replaces the old component by updating the underlying element (i.e., by calling Element.update with the new component). Otherwise, the old element is removed from the tree, the new component is inflated into an element, and the new element is inserted into the tree.

See also:

• StatefulComponent and State, for components that can build differently several times over their lifetime.
• InheritedComponent, for components that introduce ambient state that can be read by descendant components.
• StatelessComponent, for components that always build the same way given a particular configuration and ambient state.

Annotations

• @immutable

Constructors

Component({Key? key})

Initializes key for subclasses.

const

Component.element({required String tag, String? id, String? classes, Styles? styles, Map<String, String>? attributes, Map<String, EventCallback>? events, List<Component>? children, Key? key})

Creates a component which renders a html element node with the given tag, like a <div>, <button> etc.

const

factory

Component.empty({Key? key})

Creates an empty component which renders nothing.

const

factory

Component.fragment(List<Component> children, {Key? key})

Creates a component which renders a list of child components without any wrapping element.

const

factory

Component.text(String text, {Key? key})

Creates a component which renders a html text node.

const

factory

Component.wrapElement({Key? key, String? id, String? classes, Styles? styles, Map<String, String>? attributes, Map<String, EventCallback>? events, required Component child})

Creates a component which applies its parameters (like classes, styles, etc.) to its direct child element(s).

const

factory

Properties

hashCode → int

The hash code for this object.

no setter, inherited

key → Key?

Controls how one component replaces another component in the tree.

final

runtimeType → Type

A representation of the runtime type of the object.

no setter, inherited

Methods

createElement() → Element

Inflates this configuration to a concrete instance.

noSuchMethod(Invocation invocation) → dynamic

Invoked when a nonexistent method or property is accessed.

inherited

toString() → String

A string representation of this object.

inherited

Operators

operator ==(Object other) → bool

The equality operator.

inherited

Static Methods

canUpdate(Component oldComponent, Component newComponent) → bool

Whether the newComponent can be used to update an Element that currently has the oldComponent as its configuration.