Question 226898 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Change icon sort data grid from material ui

I need to know how to change this icon sort in material ui data grid to another icon
this my code for use data grid component

enter image description here

import { DataGrid, DataGridProps, GridColDef,GridColumnGroupingModel } from '@mui/x-data-grid'
export type TableColDef = GridColDef
export type TableColumnGroupingModel = GridColumnGroupingModel

export const Table = (p: DataGridProps) => {
  return <DataGrid {...p} />
}

i tried to change with css and reseach in document i need to solution for work

Tags:

2

Answers


  1. 0

    You can make use of DataGrid‘s slot prop to add slots for columnFilteredIcon slot.

    Login or Signup to reply.
  2. 0

    You can add this sx value:
    <DataGrid ..... sx={{ "& .MuiDataGrid-sortIcon": { color: "green !important" } }} />
    See the MUI doc on how to customize for more information

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search