Quasar利用Web Page Visibility API，可以让您知道网站/应用何时可见或被聚焦。

AppVisibility API

安装

// quasar.config.js

return {
  framework: {
    plugins: [
      'AppVisibility'
    ]
  }
}

用法

// 在Vue文件之外
import { AppVisibility } from 'quasar'
AppVisibility.appVisible // Boolean

// 在Vue文件之中
import { useQuasar } from 'quasar'
setup () {
  const $q = useQuasar()
  // 现在使用$q.appVisible (Boolean)
}

观察状态变化

<template>...</template>

<script>
import { useQuasar } from 'quasar'
import { watch } from 'vue'

export default {
  setup () {
    const $q = useQuasar()

    watch(() => $q.appVisible, val => {
      console.log(val ? 'App became visible' : 'App went in the background')
    })
  }
}
</script>