VueUse中文文档useDocumentVisibility
响应式跟踪 document.visibilityState
Reactively track document.visibilityState
例子
💡 最小化页面或切换标签然后返回
Usage
js
import { useDocumentVisibility } from '@vueuse/core'
const visibility = useDocumentVisibility()
import { useDocumentVisibility } from '@vueuse/core'
const visibility = useDocumentVisibility()
Component Usage
该函数还通过
@vueuse/components提供了一个无渲染的组件版本。了解更多.
This function also provides a renderless component version via the
@vueuse/componentspackage. Learn more about the usage.
html
<UseDocumentVisibility v-slot="{ visibility }">
Document Visibility: {{ visibility }}
</UseDocumentVisibility>
<UseDocumentVisibility v-slot="{ visibility }">
Document Visibility: {{ visibility }}
</UseDocumentVisibility>
Type Declarations
typescript
/**
* Reactively track `document.visibilityState`.
*
* @see https://vueuse.org/useDocumentVisibility
* @param options
*/
export declare function useDocumentVisibility({
document,
}?: ConfigurableDocument): Ref<DocumentVisibilityState>
/**
* Reactively track `document.visibilityState`.
*
* @see https://vueuse.org/useDocumentVisibility
* @param options
*/
export declare function useDocumentVisibility({
document,
}?: ConfigurableDocument): Ref<DocumentVisibilityState>