Периодически вызывать функцию, пока элемент виден

Question

У меня есть подключение к веб-сокету (socket), которое клиент должен использовать для регулярного обновления app.value. Мне нужно периодически вызывать функцию send (), пока виден отдельный div, и прекращать вызов, когда он становится невидимым. Как мне это сделать?

<div id="app">
    <div v-if="visible">
        {{value}}
        /* Periodically call send() here while this renders - how? */
    </div>
</div>

<script>
var app = new Vue({
  el: '#app',
  data: {
    visible: false,
    value: "Not loaded yet",
    },
    methods : {
        send: function (type, data) {
            socket.send("update");
        }
    }
});

/* the app.value update is already handled */
</script>

Answer 1

Я следовал предложениям ippis 'и Mark_Ms и реализовал функциональность в коде, который изменил переменную app.value:

socket.onmessage = function(e) {
    var packet = JSON.parse(e.data);
    var type = packet["type"]
    var data = packet["data"]
    if (type=="info") {
        if (app.value!==null) {
            clearInterval(app.watcher)
        }
        app.value = data
        app.watcher = setInterval(send, 1000)
    }
}