Vue-Router: $router.go(-1) doesn't work in Safari

user_5243272 0
Viewed 3023

I have the following setup in the App.vue:

<top-nav></top-nav>
<main>
    <router-view v-bind="{isOnline}"></router-view>
</main>

And in the top-nav's js I have the goBack method: 

methods: {
    goBack() {
        this.$router.go(-1);
    },
    ...
},

This works just fine in Chrome and Internet Explorer, not Safari though. When debugging and setting a breakpoint on that .go(-1)-line it hits the breakpoint and everything looks fine (nothing undefined). The navigation call isn't done though.

This doesn't work on mobile nor desktop. I thought Safari had support for the History API?

vue-router vue.js html5-history safari navigation
1 Answers

I found out that the icon I used for going back was wrapped in an anchor tag with a set href attribute.

<a v-if="showBackButton" href="#" @click="goBack">
    <i class="icon icon-200-chevron-left-small"></i>
    <p>back</p>
</a>

Solution:

Change the anchor tag to a span or something and of course remove the href attribute.

user_52432720
Related