Vue this。$ router.push在setTimeout中

时间:2017-10-15 23:26:39

标签: javascript vue.js vuejs2

我有一个登陆页面'/',用户在访问我们的网站时会点击,然后我有一个加载轮,我想加载5秒,然后将我重定向到登录{{ 1}}页面。

我正在使用Vue和Bulma.io,在我的Landing.vue页面中我有:

'/login'

在我的路由器/ index.js中我有:

<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>

所以在我的&lt;中我的功能必须有问题。脚本&gt;部分,对吗?

感谢您提供任何帮助。

1 个答案:

答案 0 :(得分:5)

如果要定义脚本部分,则需要导出实际的Vue组件。

<script>

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

    }
  }

</script>