Остановка опроса в Inertia

Давайте теперь представим панель, где живые цифры нужны не всегда: человек свернул вкладку или хочет спокойно читать блок без мигания метки. Опрос, запущенный хелпером, крутится сам, пока компонент на экране, и без явной остановки интервал продолжит ходить.

Хелпер usePoll возвращает метод stop. Его можно повесить на кнопку: после нажатия следующий тик не отправится, данные замрут на последнем значении.

Давайте снова отдадим метку с сервера:

<?php
	use Illuminate\Support\Facades\Route;
	use Inertia\Inertia;

	Route::get('/status', function () {
		return Inertia::render('Status', [
			'pulse' => now()->format('H:i:s'),
		]);
	});
?>

Давайте выведем метку, запустим опрос и добавим кнопку, которая вызывает метод stop:

<script setup>
	import { usePoll } from '@inertiajs/vue3'

	defineProps({
		pulse: String,
	})

	const { stop } = usePoll(2000)
</script>

<template>
	<p>Pulse: {{ pulse }}</p>
	<button type="button" @click="stop">
		Stop polling
	</button>
</template>

Сделайте страницу работников Shift с пропсом tick и опросом раз в четыре секунды, чтобы кнопка Pause навсегда прекращала обновление метки на этом экране.