Как динамически изменить цвет фона таблицы AgGrid? ⇐ CSS

[Anonymous]

В компоненте Navbar есть тег выбора с двумя параметрами «светлый» и «темный». Если я выбираю темный вариант, я устанавливаю это значение в localStorage, и значение localStorage правильно обновляется при выборе значения из тега выбора.
В компоненте Ag-grid я получаю это значение в переменной ловушки useState "isDarkTheme" из localStorage и использую в элементе jsx.
Но проблема в том, что если я выбираю темную опцию из компонента Navbar, темный класс не применяется в таблице AgGrid. , если я перезагружаю страницу, класс применяется. Я хочу применить темный класс в таблице AgGrid без перезагрузки страницы.
import { AgGridReact } from 'ag-grid-react';
import 'ag-grid-community/styles/ag-grid.css';
import 'ag-grid-community/styles/ag-theme-alpine.css';
class MyGridComponent extends Component {
constructor(props) {
super(props);
this.state = {
isDarkTheme: localStorage.getItem('themename') || 'light',
columnDefs: [
{ headerName: 'Make', field: 'make' },
{ headerName: 'Model', field: 'model' },
{ headerName: 'Price', field: 'price' }
],
rowData: [
{ make: 'Toyota', model: 'Celica', price: 35000 },
{ make: 'Ford', model: 'Mondeo', price: 32000 },
{ make: 'Porsche', model: 'Boxster', price: 72000 }
]
};
}
render() {
const {isDarkTheme} = this.state;
return (
className={isDarkTheme === 'dark' ? 'ag-theme-alpine-dark' : 'ag-theme-alpine'}
style={{
height: '500px',
width: '600px'
}}
>


);
}
}
export default MyGridComponent;```


Подробнее здесь: https://stackoverflow.com/questions/787 ... ynamically