DropdownMenu | DropdownMenu

`DropdownMenu`#

Descripción#

Componente raíz que provee el estado compartido del menú desplegable: apertura, cierre, gestión del foco y registro del disparador.
No dibuja nada propio; envuelve el contenido y expone el contexto vía provide.

Props#

open (boolean) — Controla el estado de apertura desde afuera con v-model:open. Por defecto: undefined (control interno).

Emite#

update:open — Se emite con el nuevo valor booleano cuando el estado de apertura cambia.

Uso#

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
<script setup lang="ts">
import { ref } from 'vue'
import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from 'vue-libvasak'

const open = ref(false)
</script>

<template>
  <DropdownMenu v-model:open="open">
    <DropdownMenuTrigger as-child>
      <button>Abrir menú</button>
    </DropdownMenuTrigger>
    <DropdownMenuContent>
      <DropdownMenuItem @select="console.log('elegido')">
        Opción
      </DropdownMenuItem>
    </DropdownMenuContent>
  </DropdownMenu>
</template>