tagsList中怎么使用 vue-contextmenujs

可以通过在 `tagsList` 组件上绑定 `v-contextmenu` 指令来添加右键菜单。下面是一个示例：

<template>
  <div>
    <div
      v-for="(tag, index) in tags"
      :key="index"
      class="tag"
      :class="{ active: tag === selectedTag }"
      @click="selectTag(tag)"
      v-contextmenu="getContextmenu(tag)"
    >
      {{ tag }}
    </div>
  </div>
</template>

<script>
import Vue from 'vue'
import Contextmenu from 'vue-contextmenujs'

Vue.use(Contextmenu)

export default {
  data() {
    return {
      tags: ['标签1', '标签2', '标签3'],
      selectedTag: null,
    }
  },
  methods: {
    selectTag(tag) {
      this.selectedTag = tag
    },
    getContextmenu(tag) {
      return [
        {
          label: `编辑 ${tag}`,
          action: () => {
            console.log(`编辑 ${tag} 被点击`)
          },
        },
        {
          label: `删除 ${tag}`,
          action: () => {
            console.log(`删除 ${tag} 被点击`)
          },
        },
      ]
    },
  },
}
</script>

在上面的代码中，我们首先使用 `Vue.use(Contextmenu)` 来全局注册 `vue-contextmenujs`，然后在 `v-contextmenu` 中动态获取菜单项并绑定到标签上。

在 `getContextmenu` 方法中，我们根据传入的标签名动态生成菜单项，菜单项中的回调函数可以执行相应的操作，例如编辑标签或删除标签。

需要注意的是，为了在 `v-contextmenu` 中动态获取菜单项，我们需要在组件中定义一个方法来生成菜单项，并在 `v-contextmenu` 中调用该方法。