https://github.com/hanhdt/vue-webble

Web Bluetooth LE UI component for Vue.js
https://github.com/hanhdt/vue-webble

bluetooth-low-energy frontend-app vuejs

Last synced: 4 days ago
JSON representation

Web Bluetooth LE UI component for Vue.js

• Host: GitHub
• URL: https://github.com/hanhdt/vue-webble
• Owner: hanhdt
• License: mit
• Created: 2019-01-12T07:27:45.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2023-04-30T05:48:44.000Z (over 1 year ago)
• Last Synced: 2024-10-27T02:07:55.717Z (17 days ago)
• Topics: bluetooth-low-energy, frontend-app, vuejs
• Language: Vue
• Homepage:
• Size: 1.83 MB
• Stars: 10
• Watchers: 4
• Forks: 3
• Open Issues: 26
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# vue-webble

Web Bluetooth LE UI plugin for Vue.js

## [Demo page](/sample)

![vue webble no devices](/sample/src/assets/webble-no-devices.png)

![vue webble list](/sample/src/assets/webble-devices-list.png)

![vue webble connected list](/sample/src/assets/webble-device-info.png)

## Features

- Manage Web Bluetooth LE devices reactively

- Simple, clean and responsive UI component can be integrated to Web app

## Installation

For NPM

```Shell

  $npm install --save vue-webble

```

Or from YARN

```Shell

  $yarn add vue-webble

```

## Mount Component

in your component, import the package as a child component.

```Javascript

import VueWebble from "vue-webble";

export default {

  // ...

  components: {

    VueWebble

  }

};

```

## Component Usages

Add VueWebble into your single component file

```Javascript

  

  

  

```

## Binding events

The `` element emits several events which you can use to observe and respond to changes in component state.

- `@scanned-devices` is fired when BLE scanning is enabled and user accepts to pair to the particular device.

- `@connected-devices` is fired when one device is connected from scanned devices list.

## Contributing

If you're interested in contributing to Vue-Webble or share your opinions, please consider to submitting a [**pull request**](https://github.com/hanhdt/vue-webble/pulls) or post [**issues**](https://github.com/hanhdt/vue-webble/issues).