<template>
  <div></div>
</template>

<script>
export default {
  mounted() {
    console.log('mounted')
    document.addEventListener('visibilitychange', this.monitor)
  },
  destroyed() {
    console.log('destroyed')
    document.removeEventListener('visibilitychange', this.monitor)
  },
  methods: {
    monitor(e: any) {
      let isExist = e.target.visibilityState
      console.log(isExist)
      if (isExist === 'visible') {
        console.log(new Date().toLocaleString(), `您已进入页面！`)
      } else {
        console.log(new Date().toLocaleString(), `您已离开页面！`)
      }
    },
  }
}
</script>
<style scoped>

</style>