laravel-vue-datatable
Version:
Vue.js datatable made with Laravel and Bootstrap in mind
64 lines (62 loc) • 1.45 kB
Markdown
```html
<template>
<data-table
:data="data"
:columns="columns"
="reloadTable">
</data-table>
</template>
```
```javascript
export default {
data() {
return {
url: "http://example.test",
data: {},
tableProps: {
search: '',
length: 10,
column: 'id',
dir: 'asc'
},
columns: [
{
label: 'ID',
name: 'id',
orderable: true,
},
{
label: 'Name',
name: 'name',
orderable: true,
},
{
label: 'Email',
name: 'email',
orderable: true,
},
]
}
},
created() {
this.getData(this.url);
},
methods: {
getData(url = this.url, options = this.tableProps) {
axios.get(url, {
params: options
})
.then(response => {
this.data = response.data;
})
// eslint-disable-next-line
.catch(errors => {
//Handle Errors
})
},
reloadTable(tableProps) {
this.getData(this.url, tableProps);
}
}
}
```