vue2-transitions
vue2-transitions copied to clipboard
Support for transition mode
Problem
Transitioning between two elements via wrapping two v-if
v-else
blocks with a transition element results in both elements appearing stacked on top of each other temporarily rather than waiting on one block to finish transitioning out before allowing the other block to transition in. Here's an example of that problem in the Vue docs.
Proposed Solution
Adding a prop that allows the user to hook into and specify the transition mode
. For example, being able to have:
<template>
<transition :mode="mode">...</transition>
</template>
<script>
export default {
...
props: {
mode: {
type: String,
default: 'out-in',
},
...
},
...
}
</script>
This change would fix the issue by default and allow users to customize the transitioning behavior between objects if they want to deviate from that behavior.