Easy Loading Screens with Vue Suspense Components
ฝัง
- เผยแพร่เมื่อ 4 ต.ค. 2024
- Suspense components are one of the well-known features in Vue 3. They allow our app to render some fallback content while waiting for asynchronous components - letting us create a smooth user experience.
Thankfully, Suspense components are extremely simple to understand and start using in your components. They don’t even require any additional imports!
By the end of this tutorial, you should know:
What Suspense components are
When to use them
How to use them
COMPANION ARTICLE
learnvue.co/20...
VUE SKELETON LOADING TUTORIAL
learnvue.co/20...
FREE VUE 3 CHEATSHEET WITH ESSENTIAL CODE SNIPPETS
learnvue.co/vu...
follow me on twitter:
/ mattmaribojoc
🚨 Like quick Vue lessons like these? Check out 800+ lessons over on Vue School - go.learnvue.co...
INTRO
Daily (Prod. by Lukrembo)
Another great tutorial, I am wondering if you could make one for passing props to route components with function mode.
That's why I love Vue so much ❤ Thanks for making our lives much easier 🌟
I came across your videos today, lots of things to learn here! :) Thanks for the great content
happy to hear :)
Thanks again. You the best sir!
Hey friend, how is going ??. Your videos are really aswome . Can you do a video showing how to use vue-pagination with vuejs 3 ??
awesome channel!
Great article. Do you always put async function outside of setup method? Is there any advantages when putting those functions inside setup?
Someone people might put a async onmounted inside setup if that solves a specific need versus making the entire setup async
Thank you
sir can u make a tutorial vuejs 3 from scratch to advance ? your explaining are very clear. thank you !!
how to add defineprops in composition API?
How would you handle a reload capability in case of error handling or even indepedently? I guess I could change the key of the #default slot to throw it away and force a reload, but for other cases i assume that i'd keep the old loading state handling. Is there a smarter way to approach reload scenarios that use Suspense?
When it will get out from experimental phase?
No official news yet, but this feature will most likely exist in all versions of Vue, but the exact syntax may change depending on developer feedback. Here's the documentation that explains it a little more: v3.vuejs.org/guide/migration/suspense.html#introduction
@@LearnVue Thanks Buddy! Would love to see project based tutorials here.
🔥👍
with vue router
Seems suspense isn't ready for production yet?
yes still in 2023 it is considered as "Experimental Feature"
please start using lint in your code... also it's a bad practice to use abbrevs.... errMsg ref should have the full name: errorMessage... notice how bad it is? abbreviations was above
Still Experimental Feature
planned to be stable in 3.4!
@@LearnVue hi, im from the future, Vue 3.4.38 exists, suspense remains experimental 😅