无法阅读属性'键入'未定义的(react-router-redux)

时间:2017-07-30 04:21:25

标签: javascript reactjs react-redux react-router-redux redux-observable

我正在尝试在退出后重定向到该页面。但是,每次我退出时,它都会成功指向页面。但是,我仍然有错误

  

无法读取属性'键入'未定义的

进一步研究"暂停捕获的例外情况",它与 react-router-redux 有关。

enter image description here

因此,下面代码中的行store.dispatch(push('/signin'))会导致问题。如果我更改为.map(() => ({ type: 'NOT_EXIST' }));,则不会有任何问题。

这可能是什么原因造成的?感谢

操作/ auth.action.js

export const signOutSucceedEpic = (action$, store) =>
  action$
    .ofType(SIGN_OUT_SUCCEED)
    .map(() => store.dispatch(push('/signin')));  // <- this line causes the issue

操作/ index.js

import { combineEpics } from 'redux-observable';

export default combineEpics(
  // ...
  signOutSucceedEpic
);

index.js

import { Provider } from 'react-redux';
import { Route } from 'react-router-dom';
import { ConnectedRouter, routerMiddleware, push } from 'react-router-redux';
import createHistory from 'history/createBrowserHistory';
import rootEpic from './actions/index';

const history = createHistory();
const routeMiddleware = routerMiddleware(history);
const epicMiddleware = createEpicMiddleware(rootEpic);

export const store = createStore(
  rootReducer,
  persistedState,
  composeWithDevTools(
    applyMiddleware(
      epicMiddleware,
      routeMiddleware
    )
  )
);

ReactDOM.render(
  <Provider store={store}>
    <ConnectedRouter history={history}>
      <div>
        <Route path="/signin" component={SignIn} />
        <Route exact path="/" component={Home} />
      </div>
    </ConnectedRouter>
  </Provider>,
  document.getElementById('root')
);

1 个答案:

答案 0 :(得分:1)

问题是你在store.dispatch运算符内调用map,映射到store.dispatch()的返回值,但它不返回任何内容,因此值{{1正在由你的史诗发出,然后由你的redux-observable代表你发送。然后react-router-redux接收到undefined值,但它假定只调度具有undefined属性的操作,因此会导致错误。

我建议重新检查redux-observable文档,因为在你的史诗中直接调用type是一种反模式,而不是必需的。你的史诗应该发出一系列动作,由redux-observable为你调度,所以在这种情况下你可以删除store.dispatch,而不是映射到store.dispatch动作的结果:

push()