Vue перейти к следующему маршруту через 10 секунд - PullRequest
Новая
       13

Vue перейти к следующему маршруту через 10 секунд

0 голосов
/ 16 сентября 2018

Я планирую сделать инфоэкран с помощью Vue. На данный момент у меня два взгляда.

Первый вид переходит ко второму виду через 10 секунд, и наоборот. 

<template>
<div v-if="posts && posts.length">
    <table>
        <tr>
            <th>Name</th>
            <th>Start</th>
            <th>Project</th>
            <th>Activity</th>
        </tr>
        <tr v-for="post of posts">
            <td>{{post.userName}}</td>
            <td>{{post.start}}</td>
            <td>{{post.projectName}}</td>
            <td>{{post.activityName}}</td>
        </tr>
    </table>
</div>

<div v-else-if="errors && errors.length">
    <h1>error connecting to API</h1>
</div>


<script>
    import axios from "axios";

    export default {
        data() {
            return {
                posts: [],
                errors: [],
                interval: null
            };
        },
        methods: {
            loadData() {
                axios
                    .get(
                        `http://myapi.com/infoscreen.php`
                    )
                    .then(response => {
                        this.posts = response.data;
                    })
                    .catch(e => {
                        this.errors.push(e);
                    });
            }
        },
        created() {
            this.loadData();
            this.interval = setInterval(
                function () {
                    this.$router.push({path: "/issues"});
                }.bind(this),
                10000
            );
        }
    };
</script>

Код работает до сих пор, после 10 секунд происходит перенаправление на проблемы с маршрутом. После того, как маршрутные проблемы загружены через 10 секунд, он возвращается к странице активности страницы из примера кода.

Кажется, что все еще есть набор интервалов. Потому что теперь через 9.x секунд происходит перенаправление, и оно происходит все быстрее и быстрее, чем больше переадресаций происходит, пока не произойдет сбой браузера.

Так есть ли лучший способ сделать что-то вроде получения всех маршрутов из router.js и затем через 10 секунд перейти на следующую страницу?

Спасибо за вашу помощь.

1 Ответ

0 голосов
/ 17 сентября 2018

Есть две вещи.Если вы хотите использовать setInterval, очистите интервал с помощью clearInterval.Для этого используйте beforeDestroy hook.

Или, что еще лучше, используйте setTimeout вместо setInterval.С setTimeout вам не придется очищать свой таймер.Это рекомендуемый подход.

...