Vue useWindowFocus 获取窗口是否是焦点状态

Vue useWindowFocus 获取窗口是否是焦点状态,比如你切换浏览器的选项卡,那么你的网页将失去焦点。

代码示例

import { useWindowFocus } from '@vueuse/core'

const focused = useWindowFocus()

组件示例

也可以通过UseWindowFocus组件获取元素大小,如果没安装需要先安装

npm i @vueuse/core @vueuse/components
<UseWindowFocus v-slot="{ focused }">
  Document Focus: {{ focused }}
</UseWindowFocus>
<script setup lang="ts">  
 //导入组件
 import { UseWindowFocus } from '@vueuse/components'
</script>

在线例子

例子