0

I have the following situation:

render() {
    let redirectRoute = window["reactRoute"];

    if (redirectRoute !== undefined) {
        window["reactRoute"] = undefined;
        return <Redirect to={redirectRoute} push={true} />;
    }

    return (
        <div className="otherContentContainer">
            <Route path="/validation" render={() => <p>TestRender</p>} />
        </div>
    );
}

The listed snippet above is a boiled down and simplified version of the affected render() in my case.

What's going on here is the following: My ASP.NET backend server returns a view which contains a subroute in window["reactRoute"] (This is something I came up with to get around the client-server routing problem with ASP.NET & React routing).

It then properly redirects to the following URL:

/Logon/validation/success

After the redirect is successful, the redirect part is not relevant anymore and I try to render certain components, in this case a simple <p> for testing purposes based on that route.

However, <Route path="/validation" render={() => <p>TestRender</p>} /> does not trigger at all, and I don't understand why.

Here is what I picked up from the React router docs:

enter image description here

Given that I didn't configure my <Route> to be exact, I don't quite see how I am different to the example.

Can you point me to where I'm going wrong?

Mr Lister
  • 45,515
  • 15
  • 108
  • 150
Sossenbinder
  • 4,852
  • 5
  • 35
  • 78

1 Answers1

1

Seems like a problem with /Logon/. Try the following instead:

<Route path="/Logon/validation" render={() => <p>TestRender</p>} />

Alternatively, you can set the basename property in the *Router component call (as mentioned here).

Lorenz Henk
  • 771
  • 5
  • 13