как остановить выполнение кода, если компонент неактивен в Nativescript Vue

Question

Мое приложение должно отправлять данные об устройстве каждые 5 секунд, но если я минимизирую приложение и снова открою его, или если я просто go вернусь на страницу и go назад, код продолжит работу даже в задний план. Когда я снова открываю приложение, функция отправки данных накладывается на уже работающую функцию и данные уходят вдвое чаще, поэтому вы можете создавать функцию на неопределенный срок

Как решить эту проблему?

Мой метод:

sendDeviceInfo(){
                console.log("1111");
                axios.post('', {
                    device: DeviceInfo.systemManufacturer() + ' ' +DeviceInfo.deviceName(),
                    deviceId: DeviceInfo.deviceId(),
                    appId: DeviceInfo.appVersion(),
                    email: this.email,
                    battery: DeviceInfo.batteryLevel(),
                    batteryCharging: DeviceInfo.isBatteryCharging() === true ? 1 : 0
                });
            }

И смонтированный:

this.sendDeviceInfo();
setInterval(this.sendDeviceInfo, 5000);

Answer 1

Вы захотите очистить интервал, когда компонент будет уничтожен. setInterval возвращает ссылку, которую можно использовать для ее очистки.

data: () => ({
    ...yourDataStuff,
    sendDeviceInfoInterval: null
}),

mounted() {
    this.sendDeviceInfoInterval = setInterval(this.sendDeviceInfo, 5000);
},

beforeDestroy() {
    clearInterval(this.sendDeviceInfoInterval);
}