使用vue-datatables 写一个表格模版 包含所有功能

好的，下面是一个使用vue-datatables的表格模板，包含了常用的功能：

<template>
  <div>
    <data-tables :data="tableData" :columns="tableColumns"
                 :options="tableOptions"></data-tables>
  </div>
</template>

<script>
  import DataTables from 'vue-data-tables'

  export default {
    components: {
      DataTables
    },

    data() {
      return {
        tableData: [{
          id: 1,
          name: 'John Doe',
          age: 35,
          email: 'john.doe@example.com'
        },{
          id: 2,
          name: 'Jane Smith',
          age: 27,
          email: 'jane.smith@example.com'
        }],
        tableColumns: [{
          label: 'ID',
          field: 'id'
        },{
          label: 'Name',
          field: 'name'
        },{
          label: 'Age',
          field: 'age'
        },{
          label: 'Email',
          field: 'email'
        }],
        tableOptions: {
          perPage: 10,
          perPageValues: [10, 25, 50, 100],
          pagination: {
            edge: true
          },
          texts: {
            count: 'Showing {from} to {to} of {count} records|{count} records|One record',
            first: 'First',
            last: 'Last',
            filter: 'Filter:',
            filterPlaceholder: 'Search query',
            limit: 'Records:',
            page: 'Page:',
            noResults: 'No matching records',
            filterBy: 'Filter by {column}',
            loading: 'Loading...'
          }
        }
      }
    }
  }
</script>

在这个模板中，我们使用了vue-data-tables组件，并且传入了三个属性：

- `data`：表格数据，可以是数组或者一个函数，返回一个Promise。
- `columns`：表格列信息，包含每一列的标签和字段名。
- `options`：表格选项，可以设置每页显示的记录数、分页选项等。

这个模板中的表格包含了分页、排序、搜索等常用功能。当然，vue-data-tables还有很多其他的功能，你可以根据自己的需求进行配置和使用。