marko
marko copied to clipboard
unable to update `<await>` promise reactively
Description
The following is not working (not sure if a bug or feature not added yet, so I chose feature request). The idea is we should be able to update a promise reactively, and the <await> should be able to handle the new promise. Otherwise the <await> is only good for the initial rendering of the app but not for subequent rendering:
class {
onCreate() {
this.state = {
count: 0,
personPromise: this.makePromise(),
}
}
makePromise = () => new Promise((resolve, reject) => {
setTimeout(() => {
console.log('hellooooooooo', this.state.count);
setTimeout(() => this.state.personPromise = this.makePromise(), 1000);
resolve({
name: "Frank " + this.state.count++
});
}, 1000);
});
}
<await(state.personPromise) timeout=5000>
<@placeholder>Loading...</@placeholder>
<@then|person|>
<div>Hello ${person.name}! ${state.count}</div>
</@then>
<@catch|err|>Error: ${err.message}</@catch>
</await>
Copy/paste that code into this playground example: https://markojs.com/try-online/?file=%2Fcomponents%2Fasync%2Fawait.marko
Why
Being able to update the promise would allow loading async values over time, not just initially.
Possible Implementation & Open Questions
Is this something you're interested in working on?
Related
- https://github.com/marko-js/marko/issues/675
Resolved in marko@6