Collapse

The ACollapse component is used to easily toggle visibility of almost any content on your pages in a vertically collapsing container. Includes support for making accordions.

Import

import { ACollapse } from 'ayovue'
import 'ayovue/themes/default/collapse.css'

Examples

View Codes

vue

<template>
  <AButton @click="opened = !opened">Show / Hide</AButton>
  <ACollapse :open="opened">
    <p class="my-p">
      Lorem ipsum dolor sit, amet consectetur adipisicing elit. Earum nisi cum asperiores magni
      blanditiis nostrum, nesciunt fuga ex mollitia veritatis aut dolorum ea! Cumque itaque
      perspiciatis culpa iste deleniti illo.
    </p>
  </ACollapse>
</template>

Props

Collapse component has the following props.

Prop name	Type	Required	Default value	Details
open	Boolean	No	false	To show or hide a section

Slots

Collapse component has the following slots.

Slot name	Description	Props
default	Collapsed Content	N/A

Collapse ​

Import ​

Examples ​

Props ​

Slots ​

Collapse

Import

Examples

Props

Slots