Localstorage

Solution To remove data from localstorage in react js, use localStorage.removeItem() method it will delete the key and value from localstorage. localStorage.removeItem() The removeItem() method of the Storage interface, when passed a key name, will remove that key from the given Storage object if it exists. Snippet In this snippet, we will delete the key and value localstorage using localStorage.removeItem() method. localStorage.removeItem('bgcolor'); Example In this example, we will store some values in local storage and then use the localStorage....

Solution To store an object in localstorage in react js, use localStorage.setItem() with the JSON.stringify() method it will convert an object into a string and store it in localstorage. localStorage.setItem() The setItem() method of the Storage interface, when passed a key name and value, will add that key to the given Storage object, or update that key’s value if it already exists. JSON.stringify() The JSON.stringify() method converts a JavaScript value to a JSON string, optionally replacing values if a replacer function is specified or optionally including only the specified properties if a replacer array is specified....

Solution To use localstorage in react js functional component, you have to use localstorage with react hooks depending upon the situation. Snippet In this snippet, we will use react hooks with localstorage for the following points. Get data from localstorage when the component load Store data on localstorage when the component load Store data on localstorage when a state change Get data from localstorage when the component load On a load of components, sometimes we need to fetch data from local storage and store it in a state to show in the UI....

Solution To clear localstorage in react js, use localStorage.clear() method it will delete all keys and values from localstorage. localStorage.clear() The clear() method of the Storage interface clears all keys stored in a given Storage object. Snippet In this snippet, we will clear all keys localstorage using localStorage.clear() method. localStorage.clear(); Example In this example, we will store some values in localstorage after then use localStorage.clear() method to delete all values....

Solution To store array in localstorage in react js, use localStorage.setItem() with JSON.stringify() method it will convert array into string and store in localstorage. localStorage.setItem() The setItem() method of the Storage interface, when passed a key name and value, will add that key to the given Storage object, or update that key’s value if it already exists. JSON.stringify() The JSON.stringify() method converts a JavaScript value to a JSON string, optionally replacing values if a replacer function is specified or optionally including only the specified properties if a replacer array is specified....

Solution To get data from localstorage in react js, use localStorage.getItem() method it will return stored value from localStorage. localStorage.getItem() The getItem() method of the Storage interface, when passed a key name, will return that key’s value, or null if the key does not exist, in the given Storage object. Snippet In this snippet, we will get some value from localstorage using localStorage.getItem() method. const token = localStorage.getItem("access_token"); console.log(token); // dXNlckBleGFtcGxlLmNvbTpzZWNyZXQ= Example In this example, we will get token from localstorage and show in the console and page....

Solution To get json from localstorage in react js, use localStorage.getItem() method it will return JSON string then use JSON.parse() method to convert it into Object. localStorage.getItem() The getItem() method of the Storage interface, when passed a key name, will return that key’s value, or null if the key does not exist, in the given Storage object. Snippet In this snippet, we will get some JSON value from localstorage using localStorage....