vue中使用vue-visibility-change監聽瀏覽器頁面之間的切換

需求：

A、B兩個頁面，從A頁面切換到B頁面，在B頁面做完操作再切換回A頁面，A頁面需要執行相關的操作

A ---> B(一些操作) ---> A(執行某些操作)

解決方案：

使用vue-visibility-change

下載：

$ npm i vue-visibility-change -S

導入：

main.js：

import visibility from 'vue-visibility-change';
Vue.use(visibility);

使用：

全局使用：

main.js

visibility.change((evt, hidden) => {
  console.log('global callback: ' + hidden);
});

局部使用：

index.vue

<template>
    <div v-visibility-change="change">
        ...
    </div>
</template>

methods:{
    change(evt, hidden) {
        //hidden爲false的時候，表示從別的頁面切換回當前頁面
        //hidden爲true的時候，表示從當前頁面切換到別的頁面
        if(hidden === false){
          console.log('回到當前頁了！')
        }
    },
}