useWindowFocus ​
Reactively track window focus with window.onfocus
and window.onblur
events.
Demo ​
💡 Click somewhere outside of the document to unfocus.
Usage ​
js
import { useWindowFocus } from '@vueuse/core'
const focused = useWindowFocus()
Component Usage ​
This function also provides a renderless component version via the
@vueuse/components
package. Learn more about the usage.
vue
<template>
<UseWindowFocus v-slot="{ focused }">
Document Focus: {{ focused }}
</UseWindowFocus>
</template>
Type Declarations ​
typescript
/**
* Reactively track window focus with `window.onfocus` and `window.onblur`.
*
* @see https://vueuse.org/useWindowFocus
*/
export declare function useWindowFocus(
options?: ConfigurableWindow,
): Ref<boolean>
Source ​
Contributors ​
Anthony Fu
vaaski
Anthony Fu
vaakian X