Flarum (v2.0.0-beta.5)
    Preparing search index...

    Class IndexSidebar<CustomAttrs>

    The Component class defines a user interface 'building block'. A component generates a virtual DOM to be rendered on each redraw.

    Essentially, this is a wrapper for Mithril's components that adds several useful features:

    • In the oninit and onbeforeupdate lifecycle hooks, we store vnode attrs in `this.attrs. This allows us to use attrs across components without having to pass the vnode to every single method.
    • The static initAttrs method allows a convenient way to provide defaults (or to otherwise modify) the attrs that have been passed into a component.
    • When the component is created in the DOM, we store its DOM element under this.element; this lets us use jQuery to modify child DOM state from internal methods via the this.$() method.
    • A convenience component method, which serves as an alternative to hyperscript and JSX.

    As with other Mithril components, components extending Component can be initialized and nested using JSX, hyperscript, or a combination of both. The component method can also be used.

    return m('div', <MyComponent foo="bar"><p>Hello World</p></MyComponent>);

    return m('div', MyComponent.component({foo: 'bar'), m('p', 'Hello World!'));

    https://mithril.js.org/components.html

    Type Parameters

    Hierarchy (View Summary)

    Index

    Constructors

    constructor

    Properties

    attrs element state

    Methods

    $ items navItems newDiscussionAction onbeforeremove onbeforeupdate oncreate oninit onremove onupdate view component initAttrs

    Constructors

    Properties

    attrs: CustomAttrs

    The attributes passed into the component.

    https://mithril.js.org/components.html#passing-data-to-components

    element: Element

    The root DOM element for the component.

    state: undefined

    Class component state that is persisted between redraws.

    Updating this will not automatically trigger a redraw, unlike other frameworks.

    This is different to Vnode state, which is always an instance of your class component.

    This is undefined by default.

    Methods

    $

    • $(selector?: string): JQuery

      Returns a jQuery object for this component's element. If you pass in a selector string, this method will return a jQuery object, using the current element as its buffer.

      For example, calling component.$('li') will return a jQuery object containing all of the li elements inside the DOM element of this component.

      Parameters

      • Optionalselector: string

        a jQuery-compatible selector string

      Returns JQuery

      the jQuery object for the DOM node

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods