useSelectionCapabilities

useSelectionCapabilities() gibt reaktive Booleans zurück, ob gängige Editor-Aktionen aktuell erlaubt sind.

Verwenden Sie es beim Erstellen von:

• Menüs
• Toolbars
• Tastaturkürzeln
• Aktionsschaltflächen
• kontextuellen Panels

Verwendung

import { useSelectionCapabilities } from '@open-pencil/vue'

const caps = useSelectionCapabilities()

Einfaches Beispiel

<script setup lang="ts">
import { useSelectionCapabilities } from '@open-pencil/vue'

const { canDelete, canDuplicate, canCreateComponent } = useSelectionCapabilities()
</script>

<template>
  <div class="flex gap-2">
    <button :disabled="!canDuplicate">Duplizieren</button>
    <button :disabled="!canDelete">Löschen</button>
    <button :disabled="!canCreateComponent">Als Komponente</button>
  </div>
</template>

Praktische Beispiele

Menüeinträge sperren

const { canMoveToPage, canGoToMainComponent } = useSelectionCapabilities()

Zoom-Befehle nur aktivieren, wenn sinnvoll

const { canZoomToSelection } = useSelectionCapabilities()

Verwandte APIs

• useSelectionState
• useEditorCommands