Router View and Back button (or swipe)

  • Hello people,
    This is my first post on the forum.

    So far I’ve created an application with tabs and by using
    <router-view> I’ve managed to change pages.
    So far, so good.

    By using the info in now I’m implementing a swipe functionality to make navigation more intuitive.

    Although I’ve read the vue-route documentation and being able to access this.$router in my code and to push new routes in the router stack, I’m a little bit confused on how to implement this:

    I have a main page, a favorite page and a search page with subpages.
    If you click on
    main page
    then on favorite
    on search
    on a search subpage#1
    on a search subpage#2
    on favorite
    on home
    on favorite

    and then start pressing (or swiping) back the default behaviour is to go from
    favorite to home,
    to favorite,
    to search subpage#2,
    to search subpage#1
    to search
    to favorite,
    to main
    and then exit.

    What I want to achieve is this:
    If you are on a subpage, I want the back button to follow the tree until it reaches the root page (in this case, the search).
    If you are on the root page (search, favorites etc) the back button should go to main page and then exit.

    I thought I could check for the current page and if its a “root” page, I could redirect to main
    or if not, I could do a this.$router.go(-1) until I reach a “root” page, then go to main, then exit (which is something that I don’t know how to do yet).

    How would you go about it?

    Thank you.

  • @terumi were you able to find a workaround? I’m having a similar issue with backbuttons. was wondering if you could share how you implemented your back button from q-tabs coming from a child route. Thanks!

Log in to reply