Вот пример использования компонента v-expansion-panelв Vue.js, популярной платформе JavaScript:

<template>
  <v-expansion-panel>
    <v-expansion-panel-content>
      <template v-slot:header>
        <v-icon>mdi-chevron-down</v-icon>
        Panel 1
      </template>
      <p>Content for Panel 1</p>
    </v-expansion-panel-content>
    <v-expansion-panel-content>
      <template v-slot:header>
        <v-icon>mdi-chevron-down</v-icon>
        Panel 2
      </template>
      <p>Content for Panel 2</p>
    </v-expansion-panel-content>
    <v-expansion-panel-content>
      <template v-slot:header>
        <v-icon>mdi-chevron-down</v-icon>
        Panel 3
      </template>
      <p>Content for Panel 3</p>
    </v-expansion-panel-content>
  </v-expansion-panel>
</template>
<script>
import { VExpansionPanel, VExpansionPanelContent, VIcon } from 'vuetify/lib'
export default {
  components: {
    VExpansionPanel,
    VExpansionPanelContent,
    VIcon
  }
}
</script>

В этом примере у нас есть компонент v-expansion-panelс тремя компонентами v-expansion-panel-contentвнутри. Каждый v-expansion-panel-contentпредставляет панель, которую можно развернуть или свернуть. Содержимое внутри каждой панели можно настроить по мере необходимости.

Чтобы использовать v-expansion-panel, вам необходимо импортировать необходимые компоненты из Vuetify, популярной библиотеки пользовательского интерфейса для Vue.js. В этом примере мы импортируем компоненты VExpansionPanel, VExpansionPanelContentи VIcon.