Vue this。$ router.push in setTimeout

Question

我有一個登陸頁面'/'，用戶在他們訪問我們的網站時會點擊，然後我有一個加載輪，我想加載5秒，然後重定向我登錄'/login'頁面。

我使用Vue公司和Bulma.io在我Landing.vue的網頁我有：

<template> 
<div class="image"> 
    <img src="../assets/landing.png"> 
    <div class="loader loading"></div> 
</div> 
</template> 


<!-- Styles --> 
<style> 
    .loading { 
    border: 2px solid #dbdbdb; 
    border-radius: 290486px; 
    border-right-color: transparent; 
    border-top-color: transparent; 
    content: ""; 
    display: block; 
    height: 1em; 
    position: absolute; 
    width: 1em; 
    transform: translate(-50%,-50%); 
    margin-right: -50%; 
    top: 30%; 
    left: 50%; 
    } 
</style> 

<!-- Scripts --> 
<script> 
setTimeout(function() { this.$router.push({ path: '/login'})},5000); 
</script> 

在我的路由器/ index.js

我：

/* 
    Necessary imports...notice I imported the two components we will use(Login and Home) 
*/ 
import Vue from 'vue' 
import Router from 'vue-router' 
import Login from '@/components/Login' 
import Home from '@/components/Home' 
import Landing from '@/components/Landing' 

// Needed to make use of the vue-router system 
Vue.use(Router) 


export default new Router({ 

    // Define the routes...will add more when they are needed 
    routes: [ 
    { 
     path: '/home', // this is the path in the URL 
     name: 'Home', 
     component: Home // created component 
    }, 
    { 
     path: '/login', // this is the path in the URL 
     name: 'Login', 
     component: Login // created component 
    }, 
    { 
     path: '/',  // this is the path in the URL 
     name: 'Landing', 
     component: Landing // created component 
    } 
    ] 
}) 

因此，必須有在我的<腳本>部分中，我的功能有問題，對吧？

感謝您的任何幫助。

Answer 1

如果您正在定義腳本部分，則需要導出實際的Vue組件。

<script> 

    export default { 
    created(){ 
     setTimeout(() => this.$router.push({ path: '/login'}), 5000); 

    } 
    } 

</script>