Skip to main content

dataKey

Description

Optional. Specifies the id of the elements to show Action Menu for

Usage

dataKey?: string;

Default value

"contextId"

Example

Here's how you can specify ActionMenu with the default dataKey:

<script>
const resolver = id => id;
let menu = $state();
</script>

<!--the resolver property enables the multi-area mode for the menu-->
<ActionMenu {options} {resolver} bind:this={menu} />

<!--a menu will appear for all items with the "data-context-id" attribute -->
{#each items as item(item.id)}
<div class="item" onclick={menu.show} data-context-id={item.id}></div>
{/each}

The example below shows how to create ActionMenu with a custom dataKey:

<ActionMenu dataKey="dataId" />
<div data-id="1"></div>

Related article: Common context for different targets