Menu
I have a Dart + Web UI app that first needs to load data from the local IndexedDB store. The IndexedDB API is asynchronous, so I will get a callback when my data is loaded. I do not want to display any UI elements until my database is first opened and ready to go.
How can I wait for my database initialization before I display my UI?
727
I am doing it in my project the Web UI way:
...
<body>
<template if="showApplication">
<span>The app is ready.</span>
</template>
</body>
...
@observable bool showApplication = false;
main() {
// Initialize...
window.indexedDB.open(...).then((_) {
showApplication = true;
});
}
This has also an added bonus: separate code / web components can also check the app state before relying on db connectivity, etc.
108
Hide the body tag with visibility:hidden:
<body style="visibility:hidden">
<!-- content -->
</body>
And then show it in your future's then() callback
window.indexedDB.open(dbName,
version: version,
onUpgradeNeeded: createObjectStore).then(handleDBOpened);
handleDBOpened(..) {
query('body').style.visibility = "visible"; // <-- show the body tag
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
