有没有办法在单个页面上禁用滚动?我尝试在特定页面上设置overflow: hidden
,但没有效果。我必须在index.css
的body上设置它才能生效,但这会禁用所有页面的滚动。所以我想到的唯一方法是基于Redux存储中的值有条件地在body上设置CSS类。是否有办法在index.js
中根据Redux存储中的值有条件地设置CSS类,或者是否有其他方法?
我的 index.js
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 "redux";
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 =(
<Provider store={store}>
<BrowserRouter>
<App/>
</BrowserRouter>
</Provider>
)
ReactDOM.render(
<React.StrictMode>
{app}
</React.StrictMode>,
document.getElementById('root')
);
serviceWorker.unregister();
overflow: hidden
,则所有其他“页面”都会受到影响,因为它们使用相同的 body。 - delmin