How to manually open a context menu?

[frankchen211]

I have a tree component, I want to build and open the context menu based on current tree item type, and what's the best way to do that?

I don't think this is a good way to do that right? But I can't see any prop like 'open' provided in Dropdown Menu.

  <TreeRoot>
    <TreeItem
      v-for="item in treeItems"
      :key="item.id"
    >
      <ContextMenu.Root>
        <ContextMenu.Trigger as-child>
          <div @contextmenu.prevent="handleContextMenu(item)">
            {{ item.name }}
          </div>
        </ContextMenu.Trigger>

        <ContextMenu.Content class="w-48">
          <ContextMenu.Item @select="() => onAction('action1')">
            action 1
          </ContextMenu.Item>

          <ContextMenu.Item v-if="item?.type === 'file'" @select="() => onAction('action2')">
            action 2
          </ContextMenu.Item>

          <ContextMenu.Item v-if="item?.type === 'folder'" @select="() => onAction('action3')">
            action 3
          </ContextMenu.Item>
        </ContextMenu.Content>
      </ContextMenu.Root>
    </TreeItem>
  </TreeRoot>