React router does not match a route when redirected from elsewhere












0















I have a Route setup like this:



<Route path="/(login|signup|reset|activate)" component={AuthPages} />


Elsewhere in my code I have a Redirect setup like this:



const urlSearch = window.location.search;
<Redirect
to={{
pathname: "/login" + urlSearch,
state: {
from: props.location,
showWarning: true
}
}}
/>


But when this redirect happens, for some reason the route does not match. If I refresh the page, then the route matches fine and the AuthPages component is appropriately rendered.



I'm not sure what's going on here. Could somebody help?










share|improve this question























  • Would the strict prop help you? reacttraining.com/react-router/web/api/Route/strict-bool

    – Pedro Otero
    Nov 21 '18 at 18:47











  • @PedroOtero I don’t see how it could but I could give a try?

    – K G
    Nov 21 '18 at 18:49
















0















I have a Route setup like this:



<Route path="/(login|signup|reset|activate)" component={AuthPages} />


Elsewhere in my code I have a Redirect setup like this:



const urlSearch = window.location.search;
<Redirect
to={{
pathname: "/login" + urlSearch,
state: {
from: props.location,
showWarning: true
}
}}
/>


But when this redirect happens, for some reason the route does not match. If I refresh the page, then the route matches fine and the AuthPages component is appropriately rendered.



I'm not sure what's going on here. Could somebody help?










share|improve this question























  • Would the strict prop help you? reacttraining.com/react-router/web/api/Route/strict-bool

    – Pedro Otero
    Nov 21 '18 at 18:47











  • @PedroOtero I don’t see how it could but I could give a try?

    – K G
    Nov 21 '18 at 18:49














0












0








0








I have a Route setup like this:



<Route path="/(login|signup|reset|activate)" component={AuthPages} />


Elsewhere in my code I have a Redirect setup like this:



const urlSearch = window.location.search;
<Redirect
to={{
pathname: "/login" + urlSearch,
state: {
from: props.location,
showWarning: true
}
}}
/>


But when this redirect happens, for some reason the route does not match. If I refresh the page, then the route matches fine and the AuthPages component is appropriately rendered.



I'm not sure what's going on here. Could somebody help?










share|improve this question














I have a Route setup like this:



<Route path="/(login|signup|reset|activate)" component={AuthPages} />


Elsewhere in my code I have a Redirect setup like this:



const urlSearch = window.location.search;
<Redirect
to={{
pathname: "/login" + urlSearch,
state: {
from: props.location,
showWarning: true
}
}}
/>


But when this redirect happens, for some reason the route does not match. If I refresh the page, then the route matches fine and the AuthPages component is appropriately rendered.



I'm not sure what's going on here. Could somebody help?







reactjs react-router






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Nov 21 '18 at 17:48









K GK G

3891820




3891820













  • Would the strict prop help you? reacttraining.com/react-router/web/api/Route/strict-bool

    – Pedro Otero
    Nov 21 '18 at 18:47











  • @PedroOtero I don’t see how it could but I could give a try?

    – K G
    Nov 21 '18 at 18:49



















  • Would the strict prop help you? reacttraining.com/react-router/web/api/Route/strict-bool

    – Pedro Otero
    Nov 21 '18 at 18:47











  • @PedroOtero I don’t see how it could but I could give a try?

    – K G
    Nov 21 '18 at 18:49

















Would the strict prop help you? reacttraining.com/react-router/web/api/Route/strict-bool

– Pedro Otero
Nov 21 '18 at 18:47





Would the strict prop help you? reacttraining.com/react-router/web/api/Route/strict-bool

– Pedro Otero
Nov 21 '18 at 18:47













@PedroOtero I don’t see how it could but I could give a try?

– K G
Nov 21 '18 at 18:49





@PedroOtero I don’t see how it could but I could give a try?

– K G
Nov 21 '18 at 18:49












1 Answer
1






active

oldest

votes


















0














Ok the solution is to provide the query string to the search property inside the location object to the Redirect component like this:



<Redirect
to={{
pathname: "/login",
search: urlSearch,
state: {
from: props.location,
showWarning: true
}
}}
/>


This works perfectly.






share|improve this answer























    Your Answer






    StackExchange.ifUsing("editor", function () {
    StackExchange.using("externalEditor", function () {
    StackExchange.using("snippets", function () {
    StackExchange.snippets.init();
    });
    });
    }, "code-snippets");

    StackExchange.ready(function() {
    var channelOptions = {
    tags: "".split(" "),
    id: "1"
    };
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function() {
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled) {
    StackExchange.using("snippets", function() {
    createEditor();
    });
    }
    else {
    createEditor();
    }
    });

    function createEditor() {
    StackExchange.prepareEditor({
    heartbeatType: 'answer',
    autoActivateHeartbeat: false,
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader: {
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    },
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    });


    }
    });














    draft saved

    draft discarded


















    StackExchange.ready(
    function () {
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53417888%2freact-router-does-not-match-a-route-when-redirected-from-elsewhere%23new-answer', 'question_page');
    }
    );

    Post as a guest















    Required, but never shown

























    1 Answer
    1






    active

    oldest

    votes








    1 Answer
    1






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    0














    Ok the solution is to provide the query string to the search property inside the location object to the Redirect component like this:



    <Redirect
    to={{
    pathname: "/login",
    search: urlSearch,
    state: {
    from: props.location,
    showWarning: true
    }
    }}
    />


    This works perfectly.






    share|improve this answer




























      0














      Ok the solution is to provide the query string to the search property inside the location object to the Redirect component like this:



      <Redirect
      to={{
      pathname: "/login",
      search: urlSearch,
      state: {
      from: props.location,
      showWarning: true
      }
      }}
      />


      This works perfectly.






      share|improve this answer


























        0












        0








        0







        Ok the solution is to provide the query string to the search property inside the location object to the Redirect component like this:



        <Redirect
        to={{
        pathname: "/login",
        search: urlSearch,
        state: {
        from: props.location,
        showWarning: true
        }
        }}
        />


        This works perfectly.






        share|improve this answer













        Ok the solution is to provide the query string to the search property inside the location object to the Redirect component like this:



        <Redirect
        to={{
        pathname: "/login",
        search: urlSearch,
        state: {
        from: props.location,
        showWarning: true
        }
        }}
        />


        This works perfectly.







        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Nov 21 '18 at 23:04









        K GK G

        3891820




        3891820
































            draft saved

            draft discarded




















































            Thanks for contributing an answer to Stack Overflow!


            • Please be sure to answer the question. Provide details and share your research!

            But avoid



            • Asking for help, clarification, or responding to other answers.

            • Making statements based on opinion; back them up with references or personal experience.


            To learn more, see our tips on writing great answers.




            draft saved


            draft discarded














            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53417888%2freact-router-does-not-match-a-route-when-redirected-from-elsewhere%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            Popular posts from this blog

            MongoDB - Not Authorized To Execute Command

            How to fix TextFormField cause rebuild widget in Flutter

            Npm cannot find a required file even through it is in the searched directory