element-UI dropdown 传多个参数

<el-tree :data="layersName" :props="defaultProps" node-key="id" :default-checked-keys="checked" show-checkbox
          @check-change="handleCheckChange" draggable :allow-drop="allowDrop" @node-drop="handleDrop">
          <div class="slot-content" slot-scope="{ node, data }">
            <div class="desc">
              <span>{{ node.label }}</span>
            </div>
            <div class="icon">
              <el-tooltip class="item" content="缩放至此图层" :open-delay="1500" placement="top-start">
                <i class="el-icon el-icon-zoom-in" @click="zoomHandle(node, data)"></i>
              </el-tooltip>
              <el-tooltip class="item" content="删除此图层" :open-delay="1500" placement="top-start">
                <i class="el-icon el-icon-delete" @click="() => remove(node, data)"></i>
              </el-tooltip>
              <el-dropdown @command="handleCommand" :show-timeout="500" size="mini">
                <i class="el-icon el-icon-s-fold"></i>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item :command="beforeHandleCommand('a',node, data)" icon="el-icon-c-scale-to-original">查看属性表</el-dropdown-item>
                  <el-dropdown-item command="b">狮子头</el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </div>
          </div>
</el-tree>
handleCommand(command) {
  switch (command.command) {
    case "a":
      this.show(command)
      break;
    case "b":
      this.show(command)
      break;
  }
},
beforeHandleCommand(type,node, data){
    return {type,node, data}
},

其实就是给command绑定一个回调函数,通过回调函数来实现传参。

posted @ 2022-08-27 20:56  槑孒  阅读(162)  评论(0编辑  收藏  举报