Data Table Component For Vue.js – Vueye

by

Vueye data table is a responsive data table component based on Vue.js 2, it organizes your data per pages in order to navigate easily.



Features:

  • Sort columns
  • Search data
  • Print your data into a spreadsheet
  • Emit checked rows and the clicked row to the parent component
  • Export to excel
  • Create your own theme (colors)
  • Many languages: English(en), Arabic(ar), French(fr), Spanish(es), German(ger) and Chinese(ch)

Data-Table-Component-For-Vue.js-Vueye

Install

Installing component using NPM

npm install vueye-datatable --save-dev

Simple example

Here is the sample example.




List of properties to customise the component.

Name Description
title the data table title
cols the attributes or columns, by default it takes the json object keys
rows_data JS array of object or json content
per-pages-values An array containing the possible number of rows per page
table-style the type of table bordered or striped
checkable show/hide the checkboxes column and the export checked rows button
v-lang specify the data table language
header-shown show/hide the data table header
theme define your own theme by specifying the background color, the text and the border bottom color

DEMO | DOWNLOAD

This awesome plugin is developed by boussadjra. Visit their official github repository for more information and follow for future updates.


Published by Rohit