How can I use localStorage in my React application?

How can I use localStorage in my React application?

You can use the localStorage API to store data in the browser. In React, you can set and get items using localStorage.setItem and localStorage.getItem.

Can you show me a code example?

Sure! Here's a simple example:

import React, { useEffect, useState } from 'react';

const App = () => {
  const [name, setName] = useState('');

  useEffect(() => {
    const storedName = localStorage.getItem('name');
    if (storedName) {
      setName(storedName);
    }
  }, []);

  const handleChange = (e) => {
    setName(e.target.value);
    localStorage.setItem('name', e.target.value);
  };

  return (
    <div>
      <input type='text' value={name} onChange={handleChange} />
    </div>
  );
};

export default App;

What happens if I clear the browser cache?

If you clear the browser cache, the data stored in localStorage will remain intact. However, clearing cookies or site data may remove it.