是官方的。 history.push不会呈现新组件

时间:2020-06-20 22:11:48

标签: javascript reactjs

history.js中的

库5.0.0不会使用'push'方法呈现新组件。它正在执行端口重定向,但组件未渲染。在重复讲这个主题之前,我尝试了互联网上的所有可用内容。 “ withRouter”,更改“ history”参数。我试图将“推”放到传奇中,并使用react钩子。我真的不知道为什么会这样。无论如何。我在下面提供代码。

App.js

import React from 'react';
import { PersistGate } from 'redux-persist/integration/react';
import { Provider } from 'react-redux';
import { Router } from 'react-router-dom';
import './config/ReactotronConfig';
import Routes from './routes/index';
import history from './services/history';
import { store, persistor } from './store/index';
import GlobalStyle from './styles/global';

function App() {
  return (
<>
  <Provider store={store}>
    <PersistGate persistor={persistor}>
      <Router history={history}>
        <Routes />
        <GlobalStyle />
      </Router>
    </PersistGate>
  </Provider>
   </>
  );
}

export default App;

index.js

import { BrowserRouter, Switch } from 'react-router-dom';
import React from 'react';
import Route from './Route';
import Landing from '../pages/Landing';
import Main from '../pages/Main';
import SignUp from '../pages/SignUp';
import Profile from '../pages/Profile';
import EditProfile from '../pages/EditProfile';
import SignIn from '../pages/SignIn';
import ForgotPassword from '../pages/ForgotPassword';
import ResetPassword from '../pages/ResetPassword';

export default function Routes() {
  return (
    <BrowserRouter>
      <Switch>
        <Route path="/" exact component={Landing} />
        <Route path="/main" component={Main} />
        <Route path="/register" component={SignUp} />
        <Route path="/login" component={SignIn} />
        <Route path="/forgot" component={ForgotPassword} />
        <Route path="/reset" component={ResetPassword} />
        <Route path="/profile" component={Profile} />

        <Route path="/editprofile" component={EditProfile} isPrivate />
      </Switch>
    </BrowserRouter>
  );
}

routes / auth / sagas.js

import { takeLatest, all, put, call } from 'redux-saga/effects';
import api from '../../../services/api';
import * as authActions from './actions';
import history from '../../../services/history';

function* login({ payload }) {
  try {
    const session = yield call(api.post, 'session', payload);
    yield put(authActions.loginSuccess(session.data));
    history.push('/main')
  } catch (error) {
    yield put(authActions.loginFailure(error));
  }
}
export default all([takeLatest('@auth/login_request', login)]);

0 个答案:

没有答案