Minimalist framework based on Web Components v1.
Uses Google Incremental DOM as render engine, and supports Facebook JSX as syntax template.
Static Method
It must returns a string with the name of the component. This name must follow the Web Component specification, so it must contain a dash (-
).
Method
It must returns a valid JSX. This JSX will be rendered as a shadow root attached to the component itself.
Method
To be invoked after a property has changed. It calls to the render
method.
Method
Called every time the component is inserted into the DOM. It calls to the refresh
method.
Method
Called every time the component is removed from the DOM. It removes the event listeners.
Method
Called every time an attribute is added, removed, updated, or replaced.
Method
Creates and returns a new DOM element of the given type
. Has the same behaviour as React.CreateElement.
Method
Registers a new component using the constructor of the given class.
Method
Returns the component that matches the given name
.
Method
Adds a component
into an existing DOM element
.
class App extends Walas.ComponentBase {
static componentName() {
return 'x-app';
}
constructor() {
super();
this._text = 0;
}
click() {
this.text ++;
}
set text(value) {
this._text = value;
this.refresh();
}
get text() {
return this._text;
}
render() {
return <div onClick={this.click}>Clicks: {this.text}</div>
}
}
var app = Walas.Components.register(App);
Walas.bootstrap(document.getElementById('app'), app);