element UI table 操作栏 dropdown 下拉展示

2,093 阅读1分钟

代码:

<el-table-column prop="tag" label="动作" min-width="180" fixed align="center">
    <template slot-scope="scope">
        <el-dropdown>
          <span class="el-dropdown-link">
            <el-button type="text">选择动作<i class="el-icon-arrow-down el-icon--right"></i></el-button>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item @click.native="mysqlDump(scope.row)">备份</el-dropdown-item>
            <el-dropdown-item @click.native="mysqlDumpFile(scope.row)">备份文件</el-dropdown-item>
            <el-dropdown-item @click.native="mysqlLog(scope.row)">备份日志</el-dropdown-item>
            <el-dropdown-item @click.native="editDatabaseIndexMysql(scope.row)">更新</el-dropdown-item>
            <el-dropdown-item @click.native="delAlone(scope.row.id)">删除</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </template>
  </el-table-column>

效果: