You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
In Lens we're building a dynamic coloring feature for the datatable, which uses EuidataGrid underneath.
Only numeric cells can be coloured, so nor dates or string cells should have a background-color style set.
The code used to color cells in this demo is taken from the EuiDataGrid documentation:
Kapture.2021-03-25.at.17.48.28.mp4
Scrolling up and down makes cleans up the colouring on the second column rows.
To check if that was an issue I've forcefully styled the cell div without the useEffect and repeated the same scenario:
Kapture.2021-03-25.at.17.51.57.mp4
This time the second column rows won't get any styling.
I solved this issue on the consumer side by providing a return function to the useEffect that will clean it up:
In Lens we're building a dynamic coloring feature for the datatable, which uses
EuidataGridunderneath.Only numeric cells can be coloured, so nor dates or string cells should have a background-color style set.
The code used to color cells in this demo is taken from the
EuiDataGriddocumentation:Kapture.2021-03-25.at.17.48.28.mp4
Scrolling up and down makes cleans up the colouring on the second column rows.
To check if that was an issue I've forcefully styled the cell
divwithout theuseEffectand repeated the same scenario:Kapture.2021-03-25.at.17.51.57.mp4
This time the second column rows won't get any styling.
I solved this issue on the consumer side by providing a return function to the
useEffectthat will clean it up:Now new cells are properly cleaned up:
Kapture.2021-03-25.at.18.18.35.mp4