title: disable scrolling on specific page
body: <p>Is there any way to disable scroll on one single page? I tried to set <code>overflow: hidden</code> on the specific page but that didn't work. I have to set it on the body in <code>index.css</code> to make it work but that obviously disable scroll on all pages. So the only way to do it that comes to my mind is to set CSS class conditionally on the body. Is there any way to conditionally set CSS class in index.js based on the value from a redux store or is there any other way?</p>
  <p>my index.js</p>
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import {BrowserRouter} from 'react-router-dom'
  import {Provider} from 'react-redux'
  import {createStore,applyMiddleware,compose,combineReducers} from &quot;redux&quot;;
  import thunk from 'redux-thunk'
  import './index.css';
  import App from './App';
  import * as serviceWorker from './serviceWorker';
  import authReducer from './store/reducers/auth'
  
  const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
  
  const rootReducer = combineReducers({
     auth: authReducer
  })
  
  const store = createStore(rootReducer,
     composeEnhancers(applyMiddleware(thunk)));
  
  const app =(
     &lt;Provider store={store}&gt;
        &lt;BrowserRouter&gt;
           &lt;App/&gt;
        &lt;/BrowserRouter&gt;
     &lt;/Provider&gt;
  )
  
  ReactDOM.render(
    &lt;React.StrictMode&gt;
       {app}
    &lt;/React.StrictMode&gt;,
    document.getElementById('root')
  );
  serviceWorker.unregister();
  </code></pre>