Prelaks
Prelaks is the Preact version of Relaks.
It works the same way as the React version. The only difference is that
renderAsync() receives three additional parameters: props, state, and context.
Example
import { h } from 'preact';
import { AsyncComponent } from 'prelaks';
class StoryView extends AsyncComponent {
renderAsync(meanwhile, props) {
let db = props.database;
let query = {
table: 'story',
criteria: {
id: props.storyID
}
};
meanwhile.show(<div>Loading</div>);
return db.findOne(query).then((story) => {
return (
<div>
<h1>{story.title}</h1>
<p>{story.text}</p>
</div>
);
});
}
}Example using async/await
import { h } from 'preact';
import { AsyncComponent } from 'prelaks';
class StoryView extends AsyncComponent {
async renderAsync(meanwhile, props) {
let db = props.database;
let query = {
table: 'story',
criteria: {
id: props.storyID
}
};
meanwhile.show(<div>Loading</div>);
let story = await db.findOne(query);
return (
<div>
<h1>{story.title}</h1>
<p>{story.text}</p>
</div>
);
}
}