<template>
<div class="demo-tabbar">
<ks-table
:columns="columns"
:data="data"
:page="page"
:pageSize="100"
:total="1000"
@sort="onSort"
@change-page="onChangePage"
></ks-table>
</div>
</template>
<script>
import KsTable from '../components/ks-table/index'
export default {
name: "table",
components: {KsTable},
data() {
return {
page: 1,
columns: [
{title: '姓名', key: 'name', width: 100, sort: true},
{title: '年龄', key: 'age', width: 100, sort: true},
{title: '手机', key: 'phone', width: 100, sort: true},
{title: '姓名', key: 'name1', width: 100, sort: true},
{title: '年龄', key: 'age1', width: 100, sort: true},
{title: '手机', key: 'phone1', width: 100, sort: true}
],
data: [
{id: '1', name: 'tom', age: 18, phone: 13211111111},
{id: '2', name: 'jack', age: 20, phone: 13211111112},
{id: '3', name: 'jojo', age: 22, phone: 13211111113},
{id: '4', name: 'tom', age: 18, phone: 13211111111},
{id: '5', name: 'jack', age: 20, phone: 13211111112},
{id: '6', name: 'jojo', age: 22, phone: 13211111113}
]
}
},
methods: {
onSort (e) {
console.log(e)
},
onChangePage (e) {
console.log(e)
this.page = e
}
}
}
</script>
<style lang="less" scoped>
.demo-tabbar {
height: 300px;
}
</style>