Vue2 navigate to external url with location.href

Question

I tried to go to \'www.mytargeturl.org\' using router.go, router.push, router.replace and window.location.href to redirect my vuejs app but i always get myVueapp.com/www.mytarge

Answer 1

Agreed with the people in other comments. Vue's philosophy is not to solve already solved problems. Same here. Just use an ordinary a tag for the link whenever possible. If you need to go through the router though, use Navigation Guards:

{
    path: '/redirect',
    beforeEnter(to, from, next) {
        // Put the full page URL including the protocol http(s) below
        window.location.replace("https://example.com")
    }
}

Answer 2

Found the solution. By adding http in my target url, all is well! Like this window.location = 'http://mytargeturl.org"

This seems to be universal javascript truth not just vue.

Answer 3

No need to use navigation guards in this case, cleaner to use dynamic redirect right there in route config

routes:[
  {
    path: '/redirect-example',
    redirect: (to: Route) => {
      window.location.href = 'http://example.com'
      return '/redirecting' // not important since redirecting
    }
  }
]