Responsive and smart vue.js datatable component
npm install vueble.html` (usa la versión que desees)
`html
`
Abre tu consola preferida en la ruta principal de tu proyecto vue2 y escribe el sigiente comando:
`npm
$ npm install vueble --save
`
Propiedades
| Propiedad | Tipo de dato |Descripcion |Requerido |
| ------------- | ------------- |------------- |------------- |
| `items`| JSON Array | data que se renderizara en el datatable | si |
| `lang` | String | lenguaje de textos del componente. Opciones disponibles `en `, es . por defecto está en inglés. | no |
| `page-length` | Number | número de botones que se mostraran en el paginador. por defecto se muestran 7 | no |
| `searcheable-props` | Array | define en un arreglo las propiedades de los items que se tomaran en cuenta para el input de busqueda | no |
Usos:
#### items (Requerido)
Solo necesitas pasar el Json con la data que quieres renderizar en el datatable, `vueble` se encarga de todo el trabajo ya que automaticamente toma el primer item para detectar los nombre de las cabeceras del datatable.
`html
`
#### lang
`html
`
#### page length
`html
`
Resultado:

#### searcheable props
Esta opción permite restringir o parametrizar el filtro de busqueda, se puede acceder a propiedades anidadas o subpropiedades con el operador `.`
`html
`
Personalización
$3
Esta cualidad te permitira editar visualmente tus cabeceras y agregarles funcionalidad con la potencia de `vue`
`html
Frist Name
Last Name
Username
@ Email
`
$3
Para poder acceder a las propiedades o subpropiedades del `item` de nuestro `JsonData` lo haremos utilizando como raiz `item.scope`. Esta cualidad te permitira editar visualmente las filas del componente y agregar funcionalidad a ellas sin depender de la programacion interna de `vueble`
`html
{{item.scope.Person.firstName}}
{{item.scope.Person.lastName}}
{{item.scope.username}}
{{item.scope.email}}
``