Vue js redirection to another page

Question

I d like to make a redirection in Vue js similar to the vanilla javascript  window location href    some url    How could I achieve this in Vue js

User · Accepted Answer

If you are using vue-router  you should use router go path  to navigate to any particular route   The router can be accessed from within a component using this  router  Otherwise  window location href    some url   works fine for non single-page apps  EDIT  router go   changed in VueJS 2 0  You can use router push   name   quot yourroutename quot    or just router push  quot yourroutename quot   now to redirect  Documentation P S  In controllers use  this  router push   name   routename

User · Answer

if you want to route to another page this  router push  path    pagename     if you want to route with params this  router push  path    pagename   param   param1   value1   param2  value2

User · Answer

can try this too       router push   name   myRoute

User · Answer

So  what I was looking for was only where to put the window location href and the conclusion I came to was that the best and fastest way to redirect is in routes  that way  we do not wait for anything to load before we redirect   Like this  routes                  path   quot   quot           name   quot ExampleRoot quot           component  exampleComponent          meta                title   quot  exampleTitle quot                     beforeEnter       gt                window location href    https   www myurl io                     Maybe it will help someone

User · Answer

lt div id  app  gt      lt a  href  path    gt Link lt  a gt   lt  div gt    lt script gt        new Vue           el    app           data              path   https   www google com                        lt  script gt  enter code here

User · Answer

window location   url     url  is the web url you want to redirect

User · Answer

When inside a component script tag  you can use the router and do something like this  this  router push   url-path

User · Answer

Just a dead simple routing    this  router push  Home

User · Answer

According to the docs  router push seems like the preferred method       To navigate to a different URL  use router push  This method pushes a   new entry into the history stack  so when the user clicks the browser   back button they will be taken to the previous URL    source  https   router vuejs org en essentials navigation html  FYI   Webpack  amp  component setup  single page app  where you import the router through Main js   I had to call the router functions by saying   this  router   Example  if you wanted to redirect to a route called  Home  after a condition is met   this  router push  Home

User · Answer

You can also use the v-bind directly to the template like       lt a  href    path-to-route     IdVariable  gt    the   is the abbreviation of v-bind

User · Answer

just use     window location href    http   siwei me    Don t use vue-router  otherwise you will be redirected to   http   yoursite com    http   siwei me   my environment   node 6 2 1  vue 1 0 21  Ubuntu

User · Answer

If anyone wants permanent redirection from one page  a to another page  b    We can use redirect  option added in the router js  For example if we want to redirect the users always to a separate page when he types the root or base url      const router   new Router     mode   history     base  process env BASE URL    routes                path             redirect    someOtherPage         name   home         component  Home                gt           import    webpackChunkName   home        views pageView home vue

User · Answer

To stay in line with your original request  window location href    some url   You can do something like this   lt div  click  quot this window location  some url  quot  gt   lt  div gt   Note that this does not take advantage of using Vue s router  but if you want to   quot make a redirection in Vue js similar to the vanilla javascript quot   this would work

[vue.js] Vue.js redirection to another page

Examples related to vue.js

Examples related to url-routing

Examples related to vuejs2

Examples related to vue-router