网址更改,但组件不更改

时间:2020-09-25 00:55:34

标签: reactjs redux react-router-dom redux-saga redux-toolkit

我想从saga中间件重定向,但是我做的方式只是更改了url,但显示的是我当前所在的页面。这就是我所做的。

function forwardTo(location) {
  console.log("location", history, location);
  history.push(location);
}

yield call(forwardTo, "/");

我正在使用redux工具包,这是我的设置

export function configureAppStore() {
  const reduxSagaMonitorOptions = {};
  const sagaMiddleware = createSagaMiddleware(reduxSagaMonitorOptions);
  const { run: runSaga } = sagaMiddleware;

  // // Create the store with saga middleware
  const middlewares = [sagaMiddleware];

  const enhancers = [
    createInjectorsEnhancer({
      createReducer,
      runSaga,
    }),
  ];

  const store = configureStore({
    reducer: createReducer(),
    middleware: [...getDefaultMiddleware(), ...middlewares],
    devTools:
      /* istanbul ignore next line */
      process.env.NODE_ENV !== "production" ||
      process.env.PUBLIC_URL.length > 0,
    enhancers,
  });

  // Make reducers hot reloadable, see http://mxs.is/googmo
  /* istanbul ignore next */
  if (module.hot) {
    module.hot.accept("./reducers", () => {
      forceReducerReload(store);
    });
  }

  return store;
}

app.js
import { BrowserRouter as Router } from "react-router-dom";
<Provider store={store}>
  <Router>
     <RouterApp />
  </Router>
</Provider>

reducer.js

import { combineReducers } from "@reduxjs/toolkit";

/**
 * Merges the main reducer with the router state and dynamically injected reducers
 */
export function createReducer(injectedReducers = {}) {
  // Initially we don't have any injectedReducers, so returning identity function to avoid the error
  if (Object.keys(injectedReducers).length === 0) {
    return (state) => state;
  } else {
    return combineReducers({
      ...injectedReducers,
    });
  }
}

utils / history.js

import { createBrowserHistory } from "history";
const history = createBrowserHistory();
export default history;

如何从saga中间件重定向到特定路由?

我不使用connected-react-router的原因是https://reactrouter.com/web/guides/deep-redux-integration

我不太确定,所以我想了解从传奇中调度路由器操作的推荐方法。

更新的代码

export function createReducer(injectedReducers = {}) {
  // Initially we don't have any injectedReducers, so returning identity function to avoid the error
  const rootReducer = combineReducers({
    ...injectedReducers,
    router: connectRouter(history),
  });
  return rootReducer;

}

index.js

const ConnectedApp = ({ Component }) => (
  <Provider store={store}>
    <ConnectedRouter history={history}>
      <Component />
    </ConnectedRouter>
  </Provider>
);

const render = (Component) => {
  ReactDOM.render(<ConnectedApp Component={Component} />, MOUNT_NODE);
};

我遇到以下问题未捕获在状态树中找不到路由器减速器,必须将其安装在“路由器”下

0 个答案:

没有答案