Transition-group mode is not supported
See original GitHub issueThe following has no effect.
<transition-group mode="out-in">
...
</transition-group>
Also confirmed in the transition-group.js
component source:
const props = extend({
tag: String,
moveClass: String
}, transitionProps)
delete props.mode
As Evan You said:
This is unlikely to happen due to the sheer complexity - it will likely introduce too much extra code for a relatively non-critical use case, and the behavior of the transition modes on multiple items can be vague and hard to define. Even if we were to implement it, we’d probably ship it as a separate plugin instead of as part of core.
I feel like this should be explicitly mentioned in the list transition documentation. It’s easy to assume that it should work, but it won’t.
Issue Analytics
- State:
- Created 5 years ago
- Reactions:3
- Comments:5 (3 by maintainers)
Top Results From Across the Web
Allow mode for transition-group #3974 - vuejs/vue - GitHub
This is what mode=out-in is meant to solve for the transition tag, ... Transition-group mode is not supported vuejs/v2.vuejs.org#1619.
Read more >Vue transition-group not working - Stack Overflow
When using transition-group in vue.js the key of the items should be a unique property. Using the index from the v-for would work...
Read more >Transition-group mode workaround - Get Help - Vue Forum
As I understand, modes are not available using transition-group, like they are with transition. Transition has out-in mode, to get the new ...
Read more >SwitchTransition - React Transition Group
A transition component inspired by the vue transition modes. You can use it when you want to control the render between state transitions....
Read more >Enter/Leave & List Transitions - Vue - w3resource
<transition name="component-fade" mode="out-in"> <component ... The <transition-group> not only animate entering and leaving, ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@emileber Doing a chunk of docs work today, so just added a fix for this, but would love to hear your thoughts on it. 🙂
I actually considered that when drafting:
However, I worried this could imply that you can use transition modes using something other than the
mode
attribute. Plus, this way, if we do provide additional ways to specify the transition mode in the future, then we don’t have to come back and update this since it just links to that section. 🙂