I have to do full offline functionality like all redux store data should remain after page refresh/offline(network connection lost). When user goes offline previously stored data should be used in viewing pages & for suppose i have big forms(ex: employee form with all work experience and personal details)suddenly if user loose network, data should not be lost.. should be saved somehow & after that when user is online have to store data to DB I am using react -18.0.0 version with react-redux & redux-saga.What are the possible ways?

CodePudding user response：

lets say users are required to log in to system .once login is successfull save that data to local storage then dispatch loginsuccess with user and token as payloads

execute a function inside useEffect in app.js to get back saved data from local storage and dispatch loginsuccess with those data

inside signup function:

let res=await axios.post("/signin",{user});
let{user,token}= res.data;
localStorage.setItem("user", JSON.stringify(user));
localStorage.setItem("token",token);
dispatch({ type: "loginsuccess",payload:{user,token}});

inside app.js :

useEffect(() => {
   
      dispatch(isUserLoggedIn());
        
  }, []);

inside isUserLoggedIn :

const localstorage = localStorage.getItem("user");
    if (localstorage) {
      const user = JSON.parse(localStorage.getItem("user"));
      dispatch({ type: "loginsuccess",payload:{user}});
    } else {
      dispatch({ type: "loginfailed",payload:{error:"please log in"}});
    }

CodePudding user response：

One way can be to store your form(or state) in localstorage. Another way can be use library redux-persist . I think your question is similar to the one asked here. Have a look here for more ideas.