device.js

? Dispositivo.js

Biblioteca reactiva para observar las propiedades esenciales del navegador y del dispositivo.

️ La versión 2 no es compatible con la versión 1. Verifique el cambio de cambios para obtener más detalles.

✔️ Características detectadas

• Nombre y versión del navegador chrome, safari, firefox, facebook, instagram, edge, ie, opera, phantomjs
• Características del navegador webp, webrtc, webgl, pwa
• portrait, landscape
• Dispositivo Tipo desktop, mobile, tablet, tv
• Dispositivo OS android, ios, windows, macos
• width, height

? Instalación

yarn add @maoosi/device.js

Uso

Uso básico:

Este código registrará viewportWidth después de cada cambio de tamaño de la vieve, estrangulada a 200 ms:

 import { device , watch } from '@maoosi/device.js'

watch ( async ( ) => {
    console . log ( device . viewportWidth )
} )

device es un objeto proxizado reactivo que se puede observar y expone las siguientes propiedades:

 interface device {
    deviceOS : string | null
    deviceType : string | null
    deviceOrientation : string | null
    browser : string | null
    browserVersion : string | null
    viewportHeight : number | null
    viewportWidth : number | null
    isBrowserEvergreen : boolean | null
    isPWA : boolean | null
    isSupportedWebP : boolean | null
    isSupportedWebGL : boolean | null
    isSupportedWebRTC : boolean | null
}

Usando vue.js:

Dado que device es un objeto proxiado reactivo, Vue.js puede observar cambios sin necesidad de usar el método watch :

 < template >
    < pre > {{ deviceInfo }} </ pre >
</ template >

< script >
import { device } from '@maoosi/device.js'

export default {
    data ( ) {
        return { deviceInfo : device }
    }
}
</ script > 

? Correr el patio de recreo

Primero, asegúrese de tener el servicio de prototipos instantáneos Vue.js instalado: https://cli.vuejs.org/guide/prototyping.html

Luego desde su terminal:

yarn playground

? Que contribuye

Las contribuciones, los problemas y las solicitudes de funciones son bienvenidas.

Licencia

Copyright © 2021 Maoosi.

Este proyecto tiene licencia MIT.