Component Structure

Sandstone components have the exact same structure as React componnents (with Preact's additions) plus some additional methods.

WebComponent methods


This method does exactly what setState does but returns a promise. You can also pass a promise into it and it will wait for it to resolve and set the state to the result of that promise. For example:

getData = async () => {
    const raw = await fetch('/api/user/profile');
    await this.setStateAsync(raw.json());

Is equal to:

getData = async () => {
    const raw = await fetch('/api/user/profile');
    const newState = = await fetch.json();
    this.setState(newState, () => this.doTheThing());


Used to automatically link your inputs to state.

class MyForm extends WebComponent {
    render() {
        return (
                <span className="preview">{this.state.inputValue}</span>
                <input onChange={this.linkState('inputValue')} />

on and trigger

These methods are explained in the Events section.

Next: Lifecycle Methods →

results matching ""

    No results matching ""