V-Offline ⚡
-
Detect offline & online events for your vue app.
-
This is on GitHub so let me know if I've b0rked it somewhere, give me a star ⭐ if you like it 🍻
-
Demo here -> 💯 Webpackbin Link
-
Website made with this: Here
Requirements
- Vue.js 2.x
✅ Install 👌
npm install v-offline
// or
yarn add v-offline✅ Usage 🎓
Register the component globally:
Vue.component('offline', require('v-offline'));Or use locally
import offline from 'v-offline';✅ Example 🍀
<offline v-on:detected-condition="detected">
<div slot="online">
Your Online Content!
</div>
<div slot="offline">
Your Offline Content!
</div>
</offline>Vue.component('example-component', {
data() {
return {
state: null,
}
},
methods: {
detected(e) {
this.state = e;
}
}
});✅ 📖 Props
| Name | Type | Default | Required? | Description |
|---|---|---|---|---|
onlineClass
| String | ui success message
| No | Styling the div which you want to give if you're online.
|
offlineClass
| String | ui error message
| No | Styling the div which you want to give if you're offline.
|
✅ 👂 Events
| Name | Description |
|---|---|
detected-condition
| Emits an Boolean value which can be used for multiple purposes in your app. |
