How to Redirect to Another Page in Vue.js after X Seconds Delay
There are the Following The simple About Vue.js has only built-in directives Full Information With Example and source code.
As I will cover this Post with live Working example to develop Redirect page after delay using Vue.js, so the Vue this.$router.push in setTimeout is used for this example is following below.
<script>
export default {
created(){
setTimeout( () => this.$router.push({ path: '/login'}), 5000);
}
}
</script>Example 1:
setTimeout(function(){ window.location = "http://www.google.com"; },3000);How to use setTimeout in Vue JS?
index.html
<!DOCTYPE html>
<html>
<head>
<title>How to use setTimeout in Vue JS? - pakainfo.com</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="root">
{{ inforamtion }}
</div>
</body>
<script type="text/javascript">
new Vue({
el: '#root',
data: {
inforamtion:"Gretting, Please Wait...."
},
methods:{
callFunction: function () {
var v = this;
setTimeout(function () {
v.inforamtion = "Hi pakainfo Website, SetTimeout is working pakainfo fine.";
}, 3000);
}
},
mounted () {
this.callFunction()
}
});
</script>
</html>I hope you get an idea about how to redirect to another page in Vue.js after 5 seconds?.
- This blog post was originally published at: https://www.pakainfo.com
2.10 GEEK