Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/egoist/vue-network
Render a Vue component to indicate network status.
https://github.com/egoist/vue-network
network vue
Last synced: about 2 months ago
JSON representation
Render a Vue component to indicate network status.
- Host: GitHub
- URL: https://github.com/egoist/vue-network
- Owner: egoist
- License: mit
- Created: 2017-09-19T03:18:06.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2022-12-07T04:13:08.000Z (about 2 years ago)
- Last Synced: 2024-10-03T12:23:18.724Z (3 months ago)
- Topics: network, vue
- Language: JavaScript
- Homepage: https://egoist.moe/vue-network
- Size: 1.12 MB
- Stars: 44
- Watchers: 3
- Forks: 4
- Open Issues: 15
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# vue-network
[![NPM version](https://img.shields.io/npm/v/vue-network.svg?style=flat)](https://npmjs.com/package/vue-network) [![NPM downloads](https://img.shields.io/npm/dm/vue-network.svg?style=flat)](https://npmjs.com/package/vue-network) [![CircleCI](https://circleci.com/gh/egoist/vue-network/tree/master.svg?style=shield)](https://circleci.com/gh/egoist/vue-network/tree/master) [![donate](https://img.shields.io/badge/$-donate-ff69b4.svg?maxAge=2592000&style=flat)](https://github.com/egoist/donate) [![chat](https://img.shields.io/badge/chat-on%20discord-7289DA.svg?style=flat)](https://chat.egoist.moe)
## Install
```bash
yarn add vue-network
```CDN: [UNPKG](https://unpkg.com/vue-network/dist/) | [jsDelivr](https://cdn.jsdelivr.net/npm/vue-network/dist/) (available as `window.VueNetwork`)
## Usage
```vue
network is fine
oops, lost network connection
import Network from 'vue-network'
export default {
components: {
Network
}
}```
## API
### Slots
- `online`: The slot to show when app is online.
- `offline`: The slot to show when app is offline.### Props
- `changedOnly`: Only show slots after network status is changed, i.e. render nothing on the first render.
### Events
- `changed`: Emitted after network status is changed, eg:
```vue
```
```js
function handleNetworkChanged(online) {
console.log(online)
}
```## Contributing
1. Fork it!
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -am 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D## Author
**vue-network** © [EGOIST](https://github.com/egoist), Released under the [MIT](./LICENSE) License.
Authored and maintained by EGOIST with help from contributors ([list](https://github.com/egoist/vue-network/contributors)).> [egoist.moe](https://egoist.moe) · GitHub [@EGOIST](https://github.com/egoist) · Twitter [@_egoistlily](https://twitter.com/_egoistlily)