ページ単一ページのアプリケーションの互換性の問題とbeforeunloadをリフレッシュVUE後の状態のデータ損失のvuex

最近のデータVUE書き込みH5プロジェクトを使用した後、ときにページをリダイレクトするか、現在のページを更新し、見つけたときにページを更新し、ストアが失われますvuexインスタンスに保存しwindow.locationの。

その後、インターネットソリューションの偉大な神を探します：

輸出のデフォルト{
  名前：「アプリケーション」、
  作成した （） {
    // ページがロードされたときのsessionStorageにステータス情報を読み取る
    IF（sessionStorage.getItem（ "ストア" ））{
         この。$ Store.replaceState（Object.assign（{}、これ。$ STORE.STATE、JSON.parse（ sessionStorage.getItem（ "ストア" ））））
    } 

    // ページがでvuexのsessionStorageを保存するための情報を更新する時期 
    window.addEventListener（ "beforeunload"、（）=> {
        sessionStorage.setItem（ "ストア"、JSON.stringify（これます$ STORE.STATE））
    }）
  }
}

クロムタイプ、ページの更新を上げた直後にvuexインスタンスデータが消えない溶液の偉大な神を取得し、この問題を解決するために非常に喜んでいたが、私が使用したときに次の日には、携帯電話のデバッグ機能はvuexデータ管理を見つけましたまだ失われました。のみ（携帯端末でbeforeunloadの互換性の問題見つけるためにbeforeunloadイベントをサポートしていません（サファリ、オペラ・モバイルなど）の点では、モバイルエンド用beforeunloadブラウザ）。

まさか、時間内にプロジェクトので、失われたデータのみをローカルに保存されているのlocalStorageに正直になることはできません、確かに非常に良いではありません格納されたデータを、削除した後、最大保存するには、ページのデータイベントを使用して、VUEのライフサイクルを使用しますが、最終的には、データ損失の問題を解決しました。

（以下の通りのlocalStorageを使用しました）：

    localStorage.setItem（「キー」、「値」）; // 「キー」に格納された値の名前「値」

    localStorage.getItem（「キー」）; //は、名前「キー」値の取得

    localStorage.removeItemを（「キー」）; // 名前の「鍵」の情報を削除します。

    localStorage.clear（）; // すべてクリア情報のlocalStorage

PC側の開発のために使用VUE後は、この問題を解決できるソリューションの神と状態のデータ損失の問題のページvuexを更新しますが、ページの最後の周りに移動し、または他の方法、それを

ページ単一ページのアプリケーションの互換性の問題とbeforeunloadをリフレッシュVUE後の状態のデータ損失のvuex

おすすめ