useDevicePixelRatio

类别

Sensors

导出大小

1.23 kB

最近修改

2 days ago

响应式追踪 window.devicePixelRatio

🌐 Reactively track window.devicePixelRatio

注意：window.devicePixelRatio 的变化没有事件监听器。因此，该函数使用 Testing media queries programmatically (window.matchMedia)，应用与 此示例 中描述的相同机制。

示例

源代码在线运行

Device Pixel Ratio:

pixelRatio: 1

Zoom in and out (or move the window to a screen with a different scaling factor) to see the value changes

用法

🌐 Usage

import { useDevicePixelRatio } from '@vueuse/core'

const { pixelRatio } = useDevicePixelRatio()

组件用法

🌐 Component Usage

<template>
  <UseDevicePixelRatio v-slot="{ pixelRatio }">
    Pixel Ratio: {{ pixelRatio }}
  </UseDevicePixelRatio>
</template>