CODEWITHSUNDEEP
vue.jsvue-router
bipin
bipin

Reputation: 419

how to redirect from one url to another in vue

I m trying to redirect from one URL to another URL using Vue router eg code 

  {
    path: '/verifyemail/:id/:token',
  //can i somelogic here when user entered 
  },
  {
    path: '/login',
    component:login

  },

what I m trying to do? when the user registered himself. server send email verification link to his email when a user clicks on verify button from his email then it should first call verifyemail url. where it has an ajax call with a parameter which i m getting from verifyemail url now after the success it should move to login url note:- i don't have any component in my verfiyemail route is it possible to do this or is there anyother way to achieve this

Upvotes: 0

Views: 3085

Answers (2)

bipin
bipin

Reputation: 419

finally, I arrive with one solution may be this help other

let start, I send the email with verify button which has link something like "localhost:8080/#/verfiyemail/("ACCESSTOKEN")" NOW I my vue part i does something like in vue-route 

path: '/verifyemail/:uid',
beforeEnter:(to, from, next) => {
                    let uid=to.params.uid;
                    next({ path: '/', query: { id: uid}})
        }
},

{
  path: '/',
  name: 'Login',
  component: Login,
},

and i my login.vue 

created(){
       this.verfiyemai();
  },
methods:{
  verfiyemai(){
       var _this=this
       var submit=0

       if(this.$route.query.id!=undefined ){

           if(this.$route.query.id.length<=50){
               this.$router.push('/');
                 submit=1;
            }

        if(submit==0){
                this.$http.get('/api/users/confirm?uid='+this.$route.query.id+'')
             .then(function (response) {
                  console.log(response)
                })
             .catch(function (error) {
               console.log(error)
                 });

            }


        }

     },

}

from email, I redirect the user to verfiyemail with token id as a parameter from verifyemail route, after that I redirect to the login URL passing the parameter as query and in my login vue I had created a method which checks query length if it greater than 50 then it will post axios response to the server

Upvotes: 1

thebeekeeper
thebeekeeper

Reputation: 364

The route configuration is only data, so there's not really any way to do this exactly as you'd like.

If you create a component to handle the /verifyemail/ route you can just use this.$router.push(redirectToMe) in it. See the Vue Router docs for more information.

Alternatively, this sounds more like something a backend server would handle on it's own, so maybe you don't even need Vue to worry about it.

Upvotes: 1

Related Questions