Home

Awesome

IMPORTANT

Version 2 of this plugin only works with Vue 3. If you need Vue 2 compatibility install version 1.0.0

vue-mobile-detection

Vue.js global function this.$isMobile() that returns a Boolean value depending on whether or not the user is browsing with a mobile

<p align="center"> <a href="https://www.npmjs.com/package/vue-mobile-detection"><img alt="NPM Version" src="https://img.shields.io/npm/v/vue-mobile-detection.svg?style=for-the-badge"></a> <a href="https://twitter.com/alberto_jrz"><img alt="Twitter" src="https://img.shields.io/static/v1.svg?label=TWITTER&message=follow&color=blue&style=for-the-badge"></a> </p>

Demo

https://ajerez.github.io/vue-mobile-detection/

Installation

With npm (Recommended)

npm i vue-mobile-detection

yarn

yarn add vue-mobile-detection

Usage

Plugin installation


import VueMobileDetection from "vue-mobile-detection";
import App from "./App.vue";

const app = createApp(App);
app.use(VueMobileDetection);

/* After the install you can use this.$isMobile() in all your vue components */

Using the plugin


<template>
  <div id="app">
    <!-- Use in template -->
    <div v-if="$isMobile()">MOBILE</div>
    <div v-else>DESKTOP OR TABLET</div>
  </div>
</template>

<script>
export default {
  created() {
    // Use in js
    console.log(this.$isMobile());
  }
};
</script>

License

This project is licensed under the terms of the MIT license