slot-operation.md

operation插槽，作用域传入当前行 row

<template>
  <el-data-table
    v-bind="$data"
  >
    <template v-slot:operation="{row}">
      <el-button @click="click(row)" type="text">点击查看控制台</el-button>
      <el-dropdown>
        <el-button type="primary" size="small">
          更多菜单<i class="el-icon-arrow-down el-icon--right"></i>
        </el-button>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item>黄金糕</el-dropdown-item>
          <el-dropdown-item>狮子头</el-dropdown-item>
          <el-dropdown-item>螺蛳粉</el-dropdown-item>
          <el-dropdown-item>双皮奶</el-dropdown-item>
          <el-dropdown-item>蚵仔煎</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
    </template>
  </el-data-table>
</template>
<script>
export default {
  data() {
    return {
      url: 'https://mockapi.eolinker.com/IeZWjzy87c204a1f7030b2a17b00f3776ce0a07a5030a1b/el-data-table?q=basic',
      hasNew: false,
      columns: [
        {prop: 'date', label: '日期'},
        {prop: 'name', label: '姓名'},
        {prop: 'address', label: '地址'},
      ],
      extraButtons: [
        {
          type: 'success',
          disabled: row => row.date === '2016-05-04',
          text: row => row.status === 'normal' ? '禁用' : '启用',
          atClick(row) {
            alert(row.name)
          }
        },
      ]
    }
  },
  methods: {
    click(row) {
      console.log(row)
    }
  }
}
</script>