el-table鼠标右键dropdown

您可以通过在 `el-table` 组件上使用 `@contextmenu` 事件来实现鼠标右键的功能。以下是一个示例：

<template>
  <el-table
    :data="tableData"
    @contextmenu="handleContextMenu"
  >
    <!-- 表格列配置 -->
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        // 表格数据
      ],
    };
  },
  methods: {
    handleContextMenu(event, row) {
      // 阻止默认的右键菜单弹出
      event.preventDefault();

      // 在指定位置显示下拉菜单
      this.$refs.dropdownMenu.style.display = 'block';
      this.$refs.dropdownMenu.style.left = `${event.pageX}px`;
      this.$refs.dropdownMenu.style.top = `${event.pageY}px`;

      // 可以根据 row 的值来判断点击的是哪一行的数据
      console.log(row);
    },
  },
};
</script>

<style scoped>
.dropdown-menu {
  display: none;
  position: absolute;
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 10px;
}
</style>

在上面的示例中，我们监听了 `el-table` 组件的 `@contextmenu` 事件，并通过 `event` 对象获取鼠标右键事件的相关信息。然后，在指定位置显示一个下拉菜单，并可以根据 `row` 的值来判断点击的是哪一行的数据。请注意，示例中使用了一个名为 `dropdown-menu` 的样式类来控制下拉菜单的样式。

希望这可以帮助到您！如果您有任何其他问题，请随时问。