reactjs - 使用 redux 中间件控制 react 路由器导航

Question

在 Redux 中间件功能的帮助下，当 显示警告模式时离开播放页面 .

问题是我此时无法控制导航。在模态显示之前页面已更改。

有什么办法可以阻止路由器导航并根据模式选择做出决定？

middleware.push(routeIntrerceptor);

.....

const routeIntrerceptor = ({dispatch, getState}) => next => action => {
  const state = getState();
  const location = state.router.location.pathname;

  if (action.type === '@@router/LOCATION_CHANGE' && location.includes('play')) {
    dispatch({ type: 'SET_DIALOG_TOGGLE' });
  }
  next(action);
};

export default routeIntrerceptor;

Answer 1

如果你想阻止用户离开页面，你可以使用 <Prompt />它带有反应路由器。

检查 react 路由器的文档 -

https://reacttraining.com/react-router/web/example/preventing-transitions