当前位置 : 主页 > 网页制作 > React >

reactjs – 从react-router-redux获取当前位置

来源:互联网 收集:自由互联 发布时间:2021-06-15
使用“react-router-redux”时如何获得当前位置? 这是路由状态: { routing: { locationBeforeTransition: { pathname: "/foo", search: "", hash: "", state: null, action: "PUSH", key: "e8jfk" }, query: null, $searchBase: { sea
使用“react-router-redux”时如何获得当前位置?

这是路由状态:

{
    routing: {
        locationBeforeTransition: {
            pathname: "/foo",
            search: "",
            hash: "",
            state: null,
            action: "PUSH",
            key: "e8jfk"
        },
        query: null,
        $searchBase: {
            search: "",
            searchBase: ""
        }
    }
}

我可以清楚地将当前位置作为state.routing.locationBeforeTransition.pathname访问,但名称“locationBeforeTransition”似乎是上一页的位置,而不是当前位置.这似乎很奇怪,这是我的路由状态中唯一的属性.我怀疑我做错了什么.

这是一个只有路由的简化reducer:

reducer.js

import { combineReducers, createStore, applyMiddleware, compose } from 'redux';
import { routerReducer, routerMiddleware } from 'react-router-redux';
import { browserHistory } from 'react-router';
import thunkMiddleware from 'redux-thunk';

const reducer = combineReducers({ 
  routing: routerReducer, 
});

export const store = createStore(reducer, {}, compose(
    applyMiddleware(
      routerMiddleware(browserHistory), 
      thunkMiddleware
    ),
    window.devToolsExtension ? window.devToolsExtension() : f => f
  )
);
你实际上无法从redux商店获得,因为根据 How do I access router state in a container component?中的react-router-redux文档:

You should not read the location state directly from the Redux store. This is because React Router operates asynchronously (to handle things such as dynamically-loaded components) and your component tree may not yet be updated in sync with your Redux state. You should rely on the props passed by React Router, as they are only updated after it has processed all asynchronous code.

网友评论