<1 min read
StaggeredFadeAndSlide
StaggeredFadeAndSlide
Renders a transition group wrapping the elements passed in the default slot and animating them with an staggered fade and slide animation.
Props
Name | Description | Type | Default |
---|---|---|---|
appear | Indicates if the transition must be applied on the initial render of the node. | boolean | true |
Slots
Name | Description | Bindings (name - type - description) |
---|---|---|
default | (Required) Transition-group content | None |
The Staggered fade and slide components works as the normal fade and slide components, but it also adds a configurable delay to each transition.
Example
Used with animatable components
<AnimatableComponent :animation="StaggeredFadeAndSlide" />
Used as a regular component:
This components exposes all the props and events of the Staggering transition group, like the tag
or the stagger
props:
<StaggeredFadeAndSlide tag="ul" :stagger="50">
<li>Element to animate</li>
<li>Element to animate</li>
<li>Element to animate</li>
</StaggeredFadeAndSlide>