acdlite / redux-router

Redux bindings for React Router – keep your router state inside your Redux store
MIT License
2.3k stars 216 forks source link

`<RouterContext>` expects a `router` rather than a `history` --- anyone else run into this problem? #242

Closed PendletonJones closed 8 years ago

PendletonJones commented 8 years ago

Required prop router was not specified in RouterContext. Check the render method of RoutingContext.

I can't figure out exactly where this warning is coming from or if it causes problems. I have tried various alterations of the routes configuration including removing the Router component and rendering the routes directly but nothing has worked.

These are my packages and I think that's it.

From what I can tell it has to do with the ReduxRouter component not passing the "router" prop to the RouterContext (formerly RoutingContext) and so is throwing the warning each time I click a Link, but I have so far been unable to track back to where "router" is supposed to come from or why it is receiving "history" instead.

The code I'm using now is nearly verbatim from the examples. Could this be a result of react-router 2.0? Thanks for any help.

"react-router": "~2.0.0",

"redux": "~3.3.1",

"redux-devtools": "~3.0.1",

"redux-immutablejs": "0.0.8",

"react": "~0.14.0",

"redux-router": "~1.0.0-beta7",

"redux-thunk": "~1.0.3"

render method

ReactDOM.render(
    <Provider 
        store={store}>
        <ReduxRouter>
                    <RouteConfig/>
                </ReduxRouter>
    </Provider>,
    document.getElementById('content')
);

routes config


const routes = (
        <Route 
            path="/" 
            component={AppContainer}>
            <Route 
                onEnter={requireAuth}
                path="main/" 
                component={MainApp}>
                <Route 
                    path="dashboard/" 
                    components={{
                        navbar: Navbar,
                        view: Dashboard
                    }}/>
                <Route 
                    path="client_profile/:client_id/" 
                    components={{
                        navbar: Navbar,
                        view: ClientProfile
                    }}/>
            </Route>
            <Route 
                onEnter={requireNonAuth}
                path={"landing/"} 
                component={LandingJumbotron}>
            </Route>
        </Route>
)

// note this has to be a function. 
const RouteConfig = () => (
    <Router>
        {routes}
    </Router>
)

module.exports = RouteConfig;
module.exports.routes = routes;

redux config

const initialState = Immutable.fromJS({});

const reducer = combineReducers({
    router: routerStateReducer,
    // the rest of the reducers here. 
});

const enhancers = compose(
    applyMiddleware(thunk),
    reduxReactRouter({
        routes,
        createHistory,
        routerStateSelector: state => state.get('router') 
    }),
    (window.devToolsExtension ? window.devToolsExtension() : undefined)
);

const store = createStore(reducer, initialState, enhancers);
mjrussell commented 8 years ago

Its definitely an issue with React Router 2.0, the latest version of this repo does not support it. I've done some upgrades for making it work with React Router 2 in my fork https://github.com/mjrussell/redux-router/tree/react-router-2

I've been meaning to get a PR in but haven't yet found the time. Let me know if that branch solves your problem.

PendletonJones commented 8 years ago

@mjrussell thanks, I'll try to take a look at it later as well and see if I can't fix the problem if it persists and I'm able to figure it out.

HriBB commented 8 years ago

@mjrussell I am using your fork and havent nad any probleme so far. But I had to clone your branch and install it locally with npm.

mjrussell commented 8 years ago

@HriBB thanks, Im going to set up a PR for for it after just updating the devDeps. I think we will merge that into master soon as a beta release

dasniko commented 8 years ago

+10 for creating a PR as this solves also my problems which were the same as in the first question!

PendletonJones commented 8 years ago

Does anyone know how to get the build working? I keep running into errors related to Babel 5/6 incompatibility and I've been coming up short on ideas for how to fix it. I did eventually get redux-router to build by installing a bunch of poorly documented plugins, removing all the decorators, and tinkering with .babelrc but that caused the build of my main project to break.

Did a reset --hard and this is the initial error that came up, later ones were related to .babelrc.presets, decorators, and class properties. "Using removed Babel 5 option: /vagrant/node_modules/redux-router/.babelrc.stage"

mjrussell commented 8 years ago

@dasniko see #245