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)

ความคิดเห็น • 24

  • @allaghi
    @allaghi 3 ปีที่แล้ว +8

    Another great tutorial, I am wondering if you could make one for passing props to route components with function mode.

  • @alnahian2003
    @alnahian2003 ปีที่แล้ว

    That's why I love Vue so much ❤ Thanks for making our lives much easier 🌟

  • @typ0_cratz
    @typ0_cratz 2 ปีที่แล้ว

    I came across your videos today, lots of things to learn here! :) Thanks for the great content

    • @LearnVue
      @LearnVue  2 ปีที่แล้ว

      happy to hear :)

  • @Lucas-mu5no
    @Lucas-mu5no 2 ปีที่แล้ว

    Thanks again. You the best sir!

  • @guipe7712
    @guipe7712 2 ปีที่แล้ว

    Hey friend, how is going ??. Your videos are really aswome . Can you do a video showing how to use vue-pagination with vuejs 3 ??

  • @UCmdrhccjVM95UidL5idZw2Q
    @UCmdrhccjVM95UidL5idZw2Q 2 ปีที่แล้ว

    awesome channel!

  • @SashaFishter
    @SashaFishter 3 ปีที่แล้ว +3

    Great article. Do you always put async function outside of setup method? Is there any advantages when putting those functions inside setup?

    • @clementebri1827
      @clementebri1827 2 ปีที่แล้ว

      Someone people might put a async onmounted inside setup if that solves a specific need versus making the entire setup async

  • @warakateng
    @warakateng ปีที่แล้ว

    Thank you

  • @yoskokleng3658
    @yoskokleng3658 2 ปีที่แล้ว

    sir can u make a tutorial vuejs 3 from scratch to advance ? your explaining are very clear. thank you !!

  • @darwinllacuna5328
    @darwinllacuna5328 2 ปีที่แล้ว

    how to add defineprops in composition API?

  • @goatfryed2890
    @goatfryed2890 2 ปีที่แล้ว

    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?

  • @cjmaaz
    @cjmaaz 3 ปีที่แล้ว +1

    When it will get out from experimental phase?

    • @LearnVue
      @LearnVue  3 ปีที่แล้ว +1

      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

    • @cjmaaz
      @cjmaaz 3 ปีที่แล้ว

      @@LearnVue Thanks Buddy! Would love to see project based tutorials here.

  • @dmitriykret8938
    @dmitriykret8938 2 ปีที่แล้ว +1

    🔥👍

  • @ronnynestares3831
    @ronnynestares3831 3 ปีที่แล้ว

    with vue router

  • @clementebri1827
    @clementebri1827 2 ปีที่แล้ว

    Seems suspense isn't ready for production yet?

    • @Markus-iq4sm
      @Markus-iq4sm ปีที่แล้ว

      yes still in 2023 it is considered as "Experimental Feature"

  • @TodorescuProgramming
    @TodorescuProgramming ปีที่แล้ว +3

    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

  • @javierantoniofelixtorres2851
    @javierantoniofelixtorres2851 ปีที่แล้ว +1

    Still Experimental Feature

    • @LearnVue
      @LearnVue  ปีที่แล้ว +1

      planned to be stable in 3.4!

    • @ricko13
      @ricko13 หลายเดือนก่อน

      @@LearnVue hi, im from the future, Vue 3.4.38 exists, suspense remains experimental 😅