table-run
v2.2.4
Published
the official table component for apprun apps
Downloads
67
Readme
table-run
the official table for apprun/fullfack apps
Demo
Requirements
- Vue 2.X.X
Usage
Install from npm
npm install table-run
Or include in your html using the script tag
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Material+Icons">
<link rel="stylesheet" href="https://unpkg.com/table-run/dist/TableRun.css" />
<script src="https://unpkg.com/table-run/dist/TableRun.js"></script>
- Add component in your app
import TableRun from 'table-run';
// or require('table-run');
// or window.TableRun if you are including in a script tag
export default {
components: {
TableRun,
},
}
- Create some parameters in your data object
export default {
data: {
columns: [
{ id: 1, name: 'Id', isSortable: { down: true, up: false } },
{ id: 2, name: 'Name', isSortable: { down: true, up: false } },
{ id: 3, name: 'Description', isSortable: { down: true, up: false } },
],
rows: [
{ id: 1, name: 'Eduardo', description: 'javascript developer' },
{ id: 2, name: 'Arelis', description: 'front-end developer' },
{ id: 3, name: 'Lndn', description: 'QP person' },
],
},
components: {
TableRun,
},
}
- In your template call the table-run component including one slot per row
<table-run v-bind:columns="columns" v-bind:rows="rows">
<template slot="rows" scope="props">
<td>{{props.row.id}}</td>
<td>{{props.row.name}}</td>
<td>{{props.row.description}}</td>
</template>
</table-run>
Build Setup
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run component