vue不使用框架在指定div中自定义右键菜单并添加两个菜单项，点击菜单项执行相应功能

您可以通过以下步骤在指定的 div 中自定义右键菜单并添加两个菜单项，点击菜单项执行相应功能：

1. 在 div 标签中添加 `@contextmenu` 事件监听器，用于监听右键菜单事件。

2. 在事件处理程序中，使用 `event.preventDefault()` 方法阻止默认的右键菜单弹出，然后通过 `event.clientX` 和 `event.clientY` 获取鼠标点击的位置。

3. 创建一个 div 元素作为自定义的右键菜单，并使用 `position: absolute` 将其定位到鼠标点击的位置。

4. 添加两个菜单项到右键菜单中，每个菜单项都为一个 button 元素，使用 `addEventListener` 方法为它们分别添加点击事件处理程序。

5. 在点击事件处理程序中，执行相应的功能代码。

以下是示例代码：

<template>
  <div @contextmenu.prevent="showContextMenu($event)">
    <!-- div 的内容 -->
  </div>
</template>

<script>
export default {
  methods: {
    showContextMenu(event) {
      // 阻止默认右键菜单
      event.preventDefault();

      // 获取鼠标点击位置
      const x = event.clientX;
      const y = event.clientY;

      // 创建自定义右键菜单
      const menu = document.createElement('div');
      menu.style.position = 'absolute';
      menu.style.left = x + 'px';
      menu.style.top = y + 'px';

      // 添加菜单项
      const item1 = document.createElement('button');
      item1.innerText = '菜单项1';
      item1.addEventListener('click', () => {
        // 点击菜单项1，执行相应功能代码
      });
      menu.appendChild(item1);

      const item2 = document.createElement('button');
      item2.innerText = '菜单项2';
      item2.addEventListener('click', () => {
        // 点击菜单项2，执行相应功能代码
      });
      menu.appendChild(item2);

      // 将自定义右键菜单添加到页面中
      document.body.appendChild(menu);
    },
  },
};
</script>