How to save data in localstorage in React JS [ Use of stringify and parse methods ]

 If we want to save string in localstorage , we can save simply like 

 localStorage.setItem('str', 'hello local')

and we can get data from local storage as follows :

     let str = localStorage.getItem('str')

     console.log(str)

But if we want to save data in array and objects format , we need to convert array and objects in string format using stringify method. 

When we need to get the saved array and objects we can convert stringified array and objects using parse method.

Example below : 

in the App.js :

function App() {

  return (

    <div>

      Hello from App.js

      <button onClick={() => {

        localStorage.setItem('arr', JSON.stringify([1, 2, 3, 4]))

        localStorage.setItem('obj', JSON.stringify({ name: 'name', address: 'address1' }))

      }} >SAVE</button>

      <button onClick={() => {

        let arr = localStorage.getItem('arr')

        console.log(JSON.parse(arr))

        let obj = localStorage.getItem('obj')

        console.log(JSON.parse(obj))

      }}>

        GET VALUES

      </button>

    </div >

  );

}

export default App;

Hope you try the code in your App.js file and if you want to check where localstorage is in the browser 

Check the image below : 

Goto Application --> localstorage --> http://localhost:3000/

If you face any issues let me know in the comments section , hope it helps you . Best of Luck