Cuando aplico los filtros en la tabla, quiero cambiar el color del ícono del ícono del filtro, pero el color del ícono no cambia de alguna manera.
Este es mi componente,
const Table = () => { const [tableFilters, setTableFilters = useState({name: []}) let tableColumns = [ { title: 'Name', dataIndex: 'name', key: 'name', filters: [], filterDropdownVisible: false, filterIcon: (filtered: boolean) => { return ( <TableFilterIcon filterColumnData={filters.name.data} /> ) }, }, ] const [columns, setColumns] = useState(tableColumns) return ( <> <CommonTable data={data} columns={tableColumns} /> </> ) } export default Table
En el componente TableFilterIcon, represento un icono coloreado y sin color en función de los filtros seleccionados; si se aplican los filtros, mostraré un icono de color. Pero el componente TableFilterIcon no se muestra cuando aplico los filtros, por eso el color del icono no cambia. ¿Quizás el componente TableFilterIcon está en el objeto de las columnas, por eso?
Nota: si no almaceno las columnas en estado y paso directamente las columnas al componente CommonTable, entonces funciona.
Puede alguien ayudarme con esto ?? Además, estoy usando Ant Design Framework para componentes de interfaz de usuario.