反応中のリフレッシュイベントの検出

Question

私は現在、ウィザードフォームでreact reduxを使用しています。私は今、フォームにデータを保持するか、データをリフレッシュするだけで、ユーザーに知らせる必要がある問題を実行します。

現在、すべてが複数の還元状態で保存されています。

ユーザーが「リフレッシュ」イベントを検出する方法はありますか？ローカルストレージを使用する可能性は非常に高いですが、最初のオプションが不思議で、可能かどうか疑問です。私はそれがReduxの店を保存するための適切なアプローチだとは思わないしかし

Answer 1

あなたはリフレッシュイベントを検出したい場合は、それはとは何の関係も反応がなく、代わりにプレーンなJavascriptのイベントハンドラを使用するには、window.onbeforeunload

window.onbeforeunload = (e) => { 
// I'm about to refresh! do something... 
}; 

と呼ばれます代わりに次のようなことをすることができます：

// load state from localStorage 
const loadState =() => { 
    try { 
    const serializedState = localStorage.getItem('state'); 
    if (serializedState === null) { 
     return undefined; // reducer will return Redux state, as localstorage is null. 
    } 
    return JSON.parse(serializedState); 
    } catch (err) { 
    return undefined; 
    } 
}; 

const saveToLocalStorage = (state) => { 
    try { 
    const serializedState = JSON.stringify(state); 
    localStorage.setItem('state', serializedState); 
    } catch (err) { 
    // ignore error 
    } 
}; 

store.subscribe(() => { 
    saveToLocalStorage(store.getState()); // save current state to localstorage. 
});