useWeb

Web APIs implemented as Vue.js composition functions

Get Started →

Reactive

All the APIs have been repurposed to be reactive so you can use them directly in your components.

Graceful Degradation

Sensible fallbacks are in place if the browser does support an API or the user doesn't give the permission.

TypeScript Support

Written in TypeScript.

# Quick Setup

Web APIs implemented as Vue.js composition functions. currently usable with the @vue/composition-api adapter for Vue.js 2.x.

# Installation

# install with yarn
yarn add @vue/composition-api vue-use-web

# install with npm
npm install @vue/composition-api vue-use-web

# Web APIs

Battery Status API.
Clipboard API.
Device Light.
Device Motion.
Device Orientation.
Document Visibility.
Event Listener.
Fetch API.
Full-screen.
Geo-location API.
Hardware Concurrency.
Intersection Observer.
Local-storage API
Media Query
Memory Status.
Mouse Position
Network Information API.
Preferred Color Scheme.
Preferred Languages.
Script.
WebSocket.
Window Scroll Position.
Window Size.
Worker.
Notification.
Bluetooth WIP.
Share WIP.

# Usage

<template>
  <div>User position is: {{ coords.longitude }} {{ coords.latitude }}</div>
</template>

<script>
import { useGeolocation } from 'vue-use-web';

export default {
  setup() {
    const { coords } = useGeolocation();

    return { coords };
  }
};
</script>