table-run v2.2.4

table-run

the official table for apprun/fullfack apps

Demo

• JSBin example

Requirements

1. Vue 2.X.X

Usage

1. 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>

2. 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,
     },
   }

3. 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,
  },
}

4. 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