Animate Lists with TransitionGroup // Vue Tutorial

แชร์
ฝัง
  • เผยแพร่เมื่อ 3 พ.ย. 2024

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

  • @destinyobamwonyi8865
    @destinyobamwonyi8865 23 ชั่วโมงที่ผ่านมา

    next time instead of using preventDefault to handle button tag reload just give it's attribute of type the value button ` ` with this the button will just act as a simple clickable tool other than a form submitting tool.

  • @theolavaux
    @theolavaux 2 ปีที่แล้ว +12

    Great explanation! Don't forget that you can use the @submit.prevent modifier to prevent the default behavior of a form! This video led me to a question, what technique do you use to animate elements when for instance the content of a div changes or the src attribute of a image is modified ? Keep uploading awesome content.

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

      if you are setting that content ot src via a ref(or a data property in options API), transitions will trigger as well

  • @FrederickAlvarez_
    @FrederickAlvarez_ 2 ปีที่แล้ว +4

    super, it would be cool if they had presets like vanish or something 😆

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

      oooh i wonder if there are any existing libraries for some of those presets

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

    This is why I am attracted to svelte, damn it

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

    PLEASE HELP!
    I can find on the documentation and a lot of videos that teach animation on a list when adding or removing an item, but what im trying to get and I cant find anywhere is how do I add animation on the render of the list. I have some inputs, I press button, I fecth a list. This list is displayed on the screen. Bu the list is displayed all at once with no animation, wih makes it wuite ugly and not user friendly. I want the list to be displayes in a flow, wach item coming one after the other from top to bottom, I have searched everywhere and I cant find one example of that on vue, if someone could help me I would be very gratefull

  • @Troy-ol5fk
    @Troy-ol5fk 2 ปีที่แล้ว

    Please make a video about vue 3.2 v-bind style, it's an interesting new feature

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

    can we use transition group without needing to replace the wrapper element?, in the example is a simple ul list, but in the case that the list needs to be rendered into a slot, how can this works?

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

      if we don't specify `tag`, it won't render a wrapper! so your example should work

  • @СаняКувалда-у4х
    @СаняКувалда-у4х 2 ปีที่แล้ว

    nice example and expalining

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

    Amazig. Do transition groups work in nuxt as well?

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

    Hi. Can you say me you theme name of vscode?

  • @augischadiegils.5109
    @augischadiegils.5109 2 ปีที่แล้ว

    ♥️♥️♥️♥️♥️

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

    why transition dont work for me

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

      what's the issue?

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

    what is your theme in vscode? :o

  • @viktorlernt6063
    @viktorlernt6063 25 วันที่ผ่านมา

    Nice infos, but the video is to fast and the voice not very clear.

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

    poofff, great man !