Skip to content

rachelies/vueified-datatables

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Vueified DataTables

Installation

Run
yarn add vueified-datatables or npm install vueified-datatables
In your code

import VueifiedDataTables from 'vueifiedDataTables';

Vue.use(VueifiedDataTables);

Then in your template

<vueified-datatable :url="URL_TO_JSON_DATA" :columns="YOUR_COLUMNS_ARRAY" :options="YOUR_OPTIONS_OBJECT(Optional)"></vueified-datatable>

Example of a columns object

let columns = [
    {
        // the key to read from json
        key: 'id',
         
        // the table header (optional, will use key by default)
        title: 'User ID',
        
        // is column sortable {true|false} (optional, true by default)
        sortable: true,
        
        // is column searchable {true|false} (optional, true by default)
        searchable: true,
        
        // Callback, receives cell value and row, should return a vue component, if is set, cell will render the component
        template: function(value, row){
            return {
                template: `<i @click="delete" class="fa fa-trash">`,
            };
        },
    },
    {
        key: 'f_name',
        title: 'First Name',
    },
];

options

  • TODO

Change log

1.0.1

  1. Refactored pagination
  2. Added basic stylesheet
  3. Updated readme

About

dataTables drop in replacement in vue

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • Vue 69.9%
  • JavaScript 16.4%
  • CSS 13.7%