vueウィンドウが閉じるかリフレッシュするかを判断する
1341 ワード
現在のプロジェクト要件:
1.同じブラウザで1つのアカウントしかログインできない
2.このブラウザの下でこのアカウントを複数のウィンドウで操作できる
3.ブラウザウィンドウが更新されたときは何もしません.ブラウザを閉じた場合は、ログイン情報を空にします.
1:
まずログイン情報をローカルにキャッシュし、localStorageで
sessionStorageを使用しないでください.sessionStorageでキャッシュされたデータは、ブラウザのアドレスバーでアドレスを入力して新しいウィンドウを開くと新しいウィンドウが開きます.
現在のウィンドウでリンクをクリックしてジャンプしない限り、共有されません.
localStorageはローカルに存在し、どのウィンドウを開いてもログイン情報というデータを共有します.
このステップは、上記の1、2の2つのニーズを実現します.
2:
ウィンドウをリフレッシュするか閉じるかを判断して3番目のニーズを実現
まずAppでvueではmountedフック関数を定義します
ここで記録して、この構想は他の人を参考にして、リンクはすでに探し出せなくて、修正した後にvueに適用します
プロジェクトの要件を満たす
1.同じブラウザで1つのアカウントしかログインできない
2.このブラウザの下でこのアカウントを複数のウィンドウで操作できる
3.ブラウザウィンドウが更新されたときは何もしません.ブラウザを閉じた場合は、ログイン情報を空にします.
1:
まずログイン情報をローカルにキャッシュし、localStorageで
sessionStorageを使用しないでください.sessionStorageでキャッシュされたデータは、ブラウザのアドレスバーでアドレスを入力して新しいウィンドウを開くと新しいウィンドウが開きます.
現在のウィンドウでリンクをクリックしてジャンプしない限り、共有されません.
localStorageはローカルに存在し、どのウィンドウを開いてもログイン情報というデータを共有します.
このステップは、上記の1、2の2つのニーズを実現します.
2:
ウィンドウをリフレッシュするか閉じるかを判断して3番目のニーズを実現
まずAppでvueではmountedフック関数を定義します
mounted(){
/**
*
* onbiforeunload onunload
*
*
* onunload ,
* 3
* helloworld 10
* , 100
*
*
* , localStorage
* , ,
*
**/
let beginTime = 0;//
let differTime = 0;//
window.onunload = function (){
differTime = new Date().getTime() - beginTime;
if(differTime <= 5) localStorage.clear();
};
window.onbeforeunload = function (){
beginTime = new Date().getTime();
};
}
ここで記録して、この構想は他の人を参考にして、リンクはすでに探し出せなくて、修正した後にvueに適用します
プロジェクトの要件を満たす