Skip to content

useWindowFocus

类别
导出体积
681 B
上次更改
2 months ago

使用 window.onfocuswindow.onblur 事件来动态地跟踪窗口焦点状态。

示例

💡 单击文档外的任何地方取消焦点。

用法

vue
<script setup lang="ts">
import { 
useWindowFocus
} from '@vueuse/core'
const
focused
=
useWindowFocus
()
</script> <template> <
div
>{{
focused
}}</
div
>
</template>

组件使用

vue
<template>
  <UseWindowFocus v-slot="{ 
focused
}">
Document Focus: {{
focused
}}
</UseWindowFocus> </template>

类型声明

ts
/**
 * 使用 `window.onfocus` 和 `window.onblur` 响应式跟踪窗口焦点。
 *
 * @see https://vueuse.org/useWindowFocus
 *
 * @__NO_SIDE_EFFECTS__
 */
export declare function 
useWindowFocus
(
options
?:
ConfigurableWindow
,
):
ShallowRef
<boolean>

源码

源码演示文档

贡献者

Anthony Fu
一纸忘忧
IlyaL
vaaski
IlyaL
SerKo
青椒肉丝
Fernando Fernández
Anthony Fu
vaakian X

更新日志

8c521 - feat(components)!: refactor components and make them consistent (#4912)
d32f8 - refactor: add @__NO_SIDE_EFFECTS__ annotations to all pure functions (#4907)
dd316 - feat: use passive event handlers everywhere is possible (#4477)
0a9ed - feat!: drop Vue 2 support, optimize bundles and clean up (#4349)