elementui tree右键菜单

ElementUI Tree组件支持右键菜单，可以通过设置tree的context-menu属性来实现。具体步骤如下：

1. 在template中添加tree组件，并设置context-menu属性为menuOptions。

<template>
  <el-tree
    :data="data"
    :props="defaultProps"
    :context-menu="menuOptions"
    @node-click="handleNodeClick">
  </el-tree>
</template>

2. 在data中定义menuOptions，包含菜单项和对应的处理函数。

data() {
  return {
    menuOptions: [
      {
        label: '新增节点',
        command: 'add',
        icon: 'el-icon-plus',
        disabled: false,
        handler: this.handleAddNode
      },
      {
        label: '删除节点',
        command: 'delete',
        icon: 'el-icon-delete',
        disabled: false,
        handler: this.handleDeleteNode
      }
    ]
  }
},

3. 在methods中定义菜单项对应的处理函数。

methods: {
  handleAddNode(data, node) {
    // 处理新增节点逻辑
  },
  handleDeleteNode(data, node) {
    // 处理删除节点逻辑
  },
  handleNodeClick(data, node, instance) {
    // 处理节点点击逻辑
  }
}

这样就可以实现ElementUI Tree组件的右键菜单功能了。