v-poll
Automatically refresh component data at intervals.
Basic Usage
Add polling to refresh the component at regular intervals.
<!-- Poll every 2 seconds (default) -->
<div v-poll>
Last updated: {{ lastUpdated }}
</div>
<!-- Custom interval -->
<div v-poll.5s>
Notifications: {{ notificationCount }}
</div>
<!-- Poll a specific method -->
<div v-poll.10s="checkStatus">
Status: {{ status }}
</div>Modifiers
.visible
Only poll when the element is visible in the viewport.
<div v-poll.5s.visible>
<!-- Only refreshes when user can see this -->
</div>.keep-alive
Continue polling even when the browser tab is inactive.
<div v-poll.5s.keep-alive>
<!-- Polls even in background tabs -->
</div>Interval Formats
| Format | Example | Duration |
|---|---|---|
| Milliseconds | v-poll.500ms |
500 milliseconds |
| Seconds | v-poll.5s |
5 seconds |
| Default | v-poll |
2 seconds |
Common Use Cases
Live Notifications
Check for new notifications periodically.
Job Progress
Monitor background job completion.
Live Scores
Update sports scores or stock prices.
Chat Messages
Fallback when WebSockets aren't available.
Consider Broadcasting
For real-time updates, consider using Broadcasting with Laravel Echo instead of polling. Broadcasting is more efficient and provides instant updates.