VueUse中文文档useWindowFocus
使用 window.onfocus 和 window.onblur 事件响应式跟踪窗口焦点。
Reactively track window focus with window.onfocus and window.onblur events.
例子
💡 点击窗口外的某个地方取消窗口聚焦。
Usage
js
import { useWindowFocus } from '@vueuse/core'
const focused = useWindowFocus()
import { useWindowFocus } from '@vueuse/core'
const focused = useWindowFocus()
Component Usage
该函数还通过
@vueuse/components提供了一个无渲染的组件版本。了解更多.
This function also provides a renderless component version via the
@vueuse/componentspackage. Learn more about the usage.
html
<UseWindowFocus v-slot="{ focused }">
Document Focus: {{ focused }}
</UseWindowFocus>
<UseWindowFocus v-slot="{ focused }">
Document Focus: {{ focused }}
</UseWindowFocus>
Type Declarations
typescript
/**
* Reactively track window focus with `window.onfocus` and `window.onblur`.
*
* @see https://vueuse.org/useWindowFocus
* @param options
*/
export declare function useWindowFocus({
window,
}?: ConfigurableWindow): Ref<boolean>
/**
* Reactively track window focus with `window.onfocus` and `window.onblur`.
*
* @see https://vueuse.org/useWindowFocus
* @param options
*/
export declare function useWindowFocus({
window,
}?: ConfigurableWindow): Ref<boolean>