category |
---|
Sensors |
Reactively track window.devicePixelRatio
NOTE: there is no event listener for
window.devicePixelRatio
change. So this function usesTesting media queries programmatically (window.matchMedia)
applying the same mechanism as described in this example.
import { useDevicePixelRatio } from '@vueuse/core'
export default {
setup() {
const { pixelRatio } = useDevicePixelRatio()
return { pixelRatio }
},
}
<template>
<UseDevicePixelRatio v-slot="{ pixelRatio }">
Pixel Ratio: {{ pixelRatio }}
</UseDevicePixelRatio>
</template>