Data iterator
El componente v-data-iterator
se utiliza para mostrar datos, y comparte la mayor parte de su funcionalidad con el componente v-data-table
. Algunas características incluyen ordenamiento, búsqueda, paginación y selección.
Uso
The v-data-iterator
allows you to customize exactly how to display your data. In this example we are using a grid list with cards. We can use the content-tag
prop (along with content-class
and content-props
) to specify what the wrapper element around the items should look like.
API
Aplica una clase personalizada al elemento que envuelve a loss elementos de la lista
Aplica props personalizadas al elemento que envuelve a los elementos de la lista
Especifica qué etiqueta debe ser utilizada por el elemento que envuelve a los elementos de la lista
Filtro de búsqueda personalizado.
Filtro de ordenamiento personalizado.
Aplica la variante del tema dark
Deshabilita el ordenamiento por default en el render inicial.
Denota la tabla como filas que son expandibles.
La función que se utiliza para filtrar los elementos.
Esconde las acciones de la tabla.
El campo en el objeto dentro de cada elemento que denota una llave única.
El arreglo de filas de la tabla.
Aplica la variante del tema light
Obliga a que al menos una columna siempre esté ordenada en lugar de variar entre los estados sorted ascending
(ordenado ascendente)/sorted descending
(ordenado descendente)/unsorted
(sin orden).
The displayed icon for forcing pagination to the next page
El texto a mostrar cuando no hay datos.
El texto a mostrar cuando no hay resultados filtrados.
Utilizado para controlar la paginación y el ordenamiento desde fuera de la tabla. Puede también ser utilizado para configurar el ordenamiento por default de la columna.
{
descending: boolean",
page: number",
rowsPerPage: number // -1 for All",
sortBy: string",
totalItems: number"
}
The displayed icon for forcing pagination to the previous page
Los valores por default para el dropdown rows-per-page.
EL texto default para rows per page
El modelo de búsqueda para filtrar los resultados.
Agrega el checkbox seleccionar todos a la fila de encabezado. Puede ser ya sea un String que especifica qué color se debe aplicar al botón, o un Boolean (que utiliza el color default).
Configura manualmente el número de filas, lo que deshabilita el ordenamiento y paginación pre-integrados. Se utiliza en conjunto con la prop de pagination
para habilitar ordenamiento y paginación del lado del servidor.
Elementos de fila seleccionados.