Valyrian.js 5.0.8

Get started - Components

What is Valyrian.js?InstallationHyperscript/JSXComponentsLifecycle methodsDirectivesServer side jsxPlugins

Components

Valyrian.js can handle multiple types of components to suit the needs of different implementations.

POJO components

let Component = {
    world: 'World',
    id: 'example',
    view() {
        return <div id={this.id}>Hello {this.world}div>;
    }
};

v(Component);
// Or 
<Component/>
<div id="example">Hello Worlddiv>
Hello World

Functional components

Stateful components

let Component = function() { return <div id={this.id}>Hello {this.world}div>;};
Component.world ='World';
Component.id = 'example';

v(Component);
// Or 
<Component/>
<div id="example">Hello Worlddiv>
Hello World

Stateless components

let Component = (props, world) => <div id={props.id}>Hello {world}div>;

v(Component, {id:'example'}, 'World');
// Or 
<Component id="example">WorldComponent>
<div id="example">Hello Worlddiv>
Hello World