• selector selects elements from the page and mounts them with a custom components. The selected elements’ name must match the custom tag name. DOM nodes having the is attribute can also be automounted

    • props optional object is passed for the component to consume. This can be anything, ranging from a simple object to a full application API. Or it can be a Flux- store. Really depends on how you want to structure your client-side applications. Also note that attributes you set on your tags will take precedence over ones specified with same names via props argument.

    • componentName optional component name in case the node to mount can’t be automounted by riot

    @returns: an array of the mounted

    Examples:

    Note: users of In-browser compilation will need to wait the components compilation before calling the riot.mount method.

    1. (async function main() {
    2. await riot.compile()
    3. const components = riot.mount('user')
    4. }())
    1. riot.mount('my-component', () => ({
    2. }))

    riot.unmount

    riot.unmount(selector: string, keepRootElement?: boolean): [HTMLElement]

    • selector selects elements from the page and unmounts them if they were mounted before.
    • keepRootElement boolean optional parameter that can be used to avoid removing the root nodes from the DOM >=4.3.0

    If the keepRootElement parameter will be true the root nodes will be left into the DOM

    1. // Select all the <user> tags, unmount them but leave their root nodes into the DOM

    @returns: an array of the mounted component objects

    riot.component(component: RiotComponentShell): function

    The riot.component method can be used to create and mount component without registering them globally:

    1. import * as riot from 'riot'
    2. import App from './app.riot'
    3. const createApp = riot.component(App)
    4. const app = createApp(document.getElementById('root'), {
    5. name: 'This is a custom property'
    6. })

    riot.install

    riot.install(plugin: function): Set

    • plugin - function receiving a component objects for any component created@returns: a javascript Set containing all the plugin functions installed

    riot.uninstall(plugin: function): Set

    • plugin - function plugin already installed before@returns: a javascript Set containing all the plugin remaining functions installed

    A plugin can be installe and uninstalled:

    1. import { install, uninstall } from 'riot'
    2. // uninstall the plugin if it's not needed anymore
    3. uninstall(uid)

    riot.register

    riot.register(name: string, component: RiotComponentShell): Map

    • name - the component name
    • component - a component shell object@returns: a javascript Map containing all registered components factory functions
    1. import { register, mount } from 'riot'
    2. import MyComponent from './my-component.riot'
    3. // register the my-component as global component
    4. register('my-component', MyComponent)
    5. // find all the DOM nodes called `<my-component>` and
    6. // mount them with the component previously registered
    7. mount('my-component')

    riot.unregister(name: string): Map

    • name - the component name@returns: a javascript Map containing the remaining registered components factory functions

    Unregistering a tag previously created via compiler or via riot.register()This method could be handy in case you need to test your app and you want to create multiple tags using the same name for example

    riot.version