Replacing route component from within an onEnter() hook

[iotch]

Hello. Is there any "legal" way to replace route component from within onEnter() hook? I'd like to show, for example, a 404 page without redirect, but keeping the same url.
Now it's possible to render 404 from route component, but it requires checking for 404 conditions in every component for every route.

Something like:

onEnter: function(nextState, replace, callback) {   
    if(someCondition) {
       callback(<Error404 />);
    } else {
       callback();
    }
}

Now I'm using:

onEnter: function(nextState, replace, callback) {    
    nextState.routes.forEach(function(route, idx) {
        if(route.path === this.path) {
            route.component = <Error404 />;
            callback();
        }
    })
}

but it looks hackish. Thanks!

[timdorr]

A better way would be to use getComponent and some global state store to communicate which component that should return. And for 404-ish pages, just having a wildcard catch-all route is normally the easiest way to do this.

[taion]

See also #3098.

[iotch]

Got it, thanks!