Vue.js detect Internet connection
We can use JavaScript navigator.onLine property to check whether user is online or offline. Here in this tutorial, we are going to explain how you can use this property to check the internet connection in vuejs. You can use our online editor to edit and run the code online.
Vue.js detect Internet connection JavaScript Example
You can detect internet connection using navigator.onLine property simply as below-
VueJS Example:
<div id="app">
<p>Connected Status = {{connectionStatus}}</p>
<button @click="myFunction()">Click Me</button>
</div>
<script>
new Vue({
el: '#app',
data: {
connectionStatus:''
},
methods:{
myFunction: function () {
if(navigator.onLine){
this.connectionStatus = "Connected to internet.";
}else{
this.connectionStatus = "Unable to connect to internet.";
}
}
}
});
</script>
|
In the above example we have checked whether user is online(connected to internet) or offline.
Output of above example-
Advertisements
