跳到主要内容

useDocumentVisibility

分类
导出大小
692 B
上次更改
2 个月前

响应式追踪 document.visibilityState

演示

💡 最小化页面或切换标签页,然后返回

用法

vue
<script setup lang="ts">
import { 
useDocumentVisibility
} from '@vueuse/core'
const
visibility
=
useDocumentVisibility
()
</script>

组件用法

此函数还通过 @vueuse/components 包提供了一个无渲染组件版本。了解更多用法

vue
<template>
  <UseDocumentVisibility v-slot="{ 
visibility
}">
Document Visibility: {{
visibility
}}
</UseDocumentVisibility> </template>

类型声明

ts
/**
 * Reactively track `document.visibilityState`.
 *
 * @see https://vueuse.org.cn/useDocumentVisibility
 *
 * @__NO_SIDE_EFFECTS__
 */
export declare function 
useDocumentVisibility
(
options
?:
ConfigurableDocument
,
):
ShallowRef
<string, string>
export type
UseDocumentVisibilityReturn
=
ReturnType
<
typeof
useDocumentVisibility
>

来源

源码演示文档

贡献者

Anthony Fu
Anthony Fu
Antério Vieira
IlyaL
SerKo
青椒肉丝
Robin
IlyaL
James Garbutt
Fernando Fernández
vaakian X
Jelf
Shinigami
wheat
Alex Kozack
Scott Bedard

更新日志

8c521 - feat(components)!: 重构组件并使其保持一致 (#4912)
v13.6.0
d32f8 - refactor: 为所有纯函数添加 @__NO_SIDE_EFFECTS__ 注释 (#4907)
v12.4.0
dd316 - feat: 尽可能在所有地方使用被动事件处理程序 (#4477)
0a9ed - feat!: 放弃对 Vue 2 的支持,优化打包并清理 (#4349)

根据 MIT 许可证发布。