<1 min read

CollapseHeight

CollapseHeight

Renders a transition wrapping the element passed in the default slot and animating it with a height 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) to add content to the transition None

Examples

The CollapseHeight component is intended to be used as animation to wrap an element with v-if or v-show and animate it. The animation consists on scale its height size from 0 to auto. This transition does not work with components that have vertical margin, padding or border.

Used wrapping a component:

<CollapseHeight>
  <ComponentOrElement v-if="open"/>
</CollapseHeight>