vue+element在table中填充button使button作为表内元素并实现Button按钮的对齐

在Vue.js和Element UI中，可以使用`<el-table-column>`的`scoped-slot`来实现在table中填充button，并且控制button的对齐方式。以下是一个示例代码：

<template>
  <el-table :data="tableData">
    <el-table-column label="姓名" prop="name"></el-table-column>
    <el-table-column label="年龄" prop="age"></el-table-column>
    <el-table-column label="操作">
      <template slot-scope="scope">
        <div class="button-group">
          <el-button type="primary" @click="handleEdit(scope.row)">编辑</el-button>
          <el-button type="danger" @click="handleDelete(scope.row)">删除</el-button>
        </div>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        {
          name: '张三',
          age: 18
        },
        {
          name: '李四',
          age: 20
        }
      ]
    }
  },
  methods: {
    handleEdit(row) {
      // 处理编辑事件
    },
    handleDelete(row) {
      // 处理删除事件
    }
  }
}
</script>

<style scoped>
.button-group {
  display: flex;
  justify-content: center;
  align-items: center;
}
.button-group .el-button {
  margin-right: 10px;
}
</style>

在这个例子中，我们使用了`<el-table-column>`的`scoped-slot`来嵌入button组件，并使用了CSS的flex布局来控制button的对齐方式。`scoped-slot`中的`scope`参数可以访问到当前行的数据对象，可以在点击事件中处理相关逻辑。

你可以根据需要修改按钮的样式和事件处理逻辑，并使用CSS的flex布局来控制按钮的对齐方式。