Redirect page after delay using Vuejs

Today, We want to share with you Redirect page after delay using Vuejs.In this post we will show you vue router push callback, hear for settimeout in vue methods we will give you demo and example for implement.In this post, we will learn about vue router redirect with params with an example.

Redirect page after delay using Vuejs

There are the Following The simple About Redirect page after delay using Vuejs Full Information With Example and source code.

As I will cover this Post with live Working example to develop vue router previous route, so the vue router back button for this example is following below.

Vue this.$router.push in setTimeout

Simple We need to export an actual main Vue component.


html part


style.css


Page Redirect after specified time with Vuejs

In Vue.js, you can redirect the user to a different page after a specified time using the setTimeout() function and the router object.

First, you need to import the router object from your router file. Here’s an example of how to do that:

import router from '@/router'

Next, you can use the setTimeout() function to wait for a specified amount of time and then use the router.push() method to redirect the user to a different page. Here’s an example:

setTimeout(() => {
  router.push('/dashboard')
}, 5000)

In this example, we’re using the setTimeout() function to wait for 5000 milliseconds (or 5 seconds), and then we’re using the router.push() method to redirect the user to the /dashboard page.

You can put this code in the created() or mounted() lifecycle hook of a Vue component to trigger the redirect when the component is created or mounted.

Here’s the complete code for a simple Vue component that redirects the user after 5 seconds:





In this example, we’re using the created() lifecycle hook to set up the redirect. The router object is imported at the top of the file, and the setTimeout() function is used to wait for 5000 milliseconds before redirecting to the dashboard page.

Web Programming Tutorials Example with Demo

Read :

Summary

You can also read about AngularJS, ASP.NET, VueJs, PHP.

I hope you get an idea about Redirect page after delay using Vuejs.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

Leave a Comment