Vue Bootstrap Table
by KevinGabbert
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.24/vue.min.js"></script>
<script src="https://rawgit.com/wenzhixin/vue-bootstrap-table/develop/docs/static/dist/vue-bootstrap-table.js"></script>
<div id="table">
<bootstrap-table :columns="columns" :data="data" :options="options"></bootstrap-table>
</div>
JavaScript
var vm = new Vue({
el: '#table',
components: {
'bootstrap-table': BootstrapTable
},
data: {
columns: [
{
title: 'User ID',
field: 'userid'
},
{
field: 'firstname',
title: 'First Name'
}, {
field: 'lastname',
title: 'Last Name'
}, {
field: 'roles',
title: 'Roles'
}
],
data: [{"firstname":"Kevin","lastname":"Gabbert","roles":"User Admin","userid":"1"},{"firstname":"Josh","lastname":"Luth","roles":"User Admin","userid":"2"},{"firstname":"Elizabeth","lastname":"Braithwaite","roles":"User","userid":"3"},{"firstname":"Rory","lastname":"Plaire","roles":"None","userid":"4"}],
options: {
}
}
});