vue3-rightmenus

npm i vue3-rightmenus

import rightMenus from "vue3-rightmenus";
Vue.use(rightMenus);

<template>
  <div>
    <div class="box" v-rightMenu:contextmenu="{ id: 123 }">右键点击我</div>
    <v-contextmenu ref="contextmenu" @show="showMenuBox">
      <v-contextmenu-item> 授权 </v-contextmenu-item>
      <v-contextmenu-divider />
      <v-contextmenu-submenu title="排序方式">
        <v-contextmenu-item>名称</v-contextmenu-item>
        <v-contextmenu-item>日期</v-contextmenu-item>
        <v-contextmenu-submenu title="更多">
          <v-contextmenu-item>大小</v-contextmenu-item>
          <v-contextmenu-item>标记</v-contextmenu-item>
          <v-contextmenu-item>类型</v-contextmenu-item>
        </v-contextmenu-submenu>
      </v-contextmenu-submenu>
      <v-contextmenu-item disabled>测试</v-contextmenu-item>
      <v-contextmenu-divider />
      <v-contextmenu-item>打开属性</v-contextmenu-item>
    </v-contextmenu>
  </div>
</template>