# Filtros por columnas

# Introducción

Esta propiedad renderizará un componente sobre la columna correspondiente que manejarán un valor para filtrar cada resgitro según el valor de la columna correspondiente.

# Uso

Para renderizar los filtros se deben enviar headers de esta forma:

[
  {
    "text": "FRUTA",
    "value": "fruta",
    "filter-component": {
      "type": "IrTextField",
      "props": {
        "label": "Filtrar por nombre",
        "value": ""
      }
    },
    "sortable": false
  },
  {
    "text": "CALORIAS",
    "value": "calorias",
    "filter-component": {
      "type": "IrSelect",
      "props": {
        "label": "Filtro por peso",
        "hint": "",
        "value": 2,
        "width": 2,
        "items": [
          {
            "text": "22",
            "value": 22
          },
          {
            "text": "33",
            "value": 32
          }
        ]
      }
    },
    "sortable": false
  }
]

# Ejemplo

# Propiedades

Propiedad Tipo Default Requerido Descripción

column-filters

Object

{
  tooltip: "Column filters",
}

false

Determinan la forma de mostrar los filtros. Para que se muestren los filtros de tabla se debe enviar al menos un header con la propiedad filter-component valorizada. También en los headers podrá determinar mas propiedades: componente a renderizar y atributos de dicho componente. La estructura esperada es la siguiente:

{
  tooltip: "Column filters", // tooltip que se mostrará en el botón que oculta y muestra los filtros de columna
  "is-visible-on-load": true, // Determina si al mostrarse la tabla inicialmente se hará con los filtros abiertos
  "color": "primary", // Determina el color del boton de filtros
  "label": "", // Determina el texto del boton
  "icon": "mdi-icon" // Determina el ícono del botón
}

# Propiedades de los headers

Propiedad	Tipo	Default	Requerido	Descripción
filter-component	Object	'{}'	false	Determina el componente que se va a renderizar para filtrar en la columna. Debe tener las propiedades `type` y `props` como cualquier componente.

← Filtros Comportamientos →