How do I implement logout functionality in a React app?

How do I implement logout functionality in a React app?

To implement logout functionality in a React app, you can follow these steps: 1. Create a logout function that clears user data. 2. Use state management (like Context API or Redux) to update the authentication state. 3. Redirect the user to the login page after logout.

What should the logout function look like?

The logout function can look like this:

const logout = () => {
  // Clear user data
  localStorage.removeItem('user');
  // Update state
  setUser(null);
  // Redirect to login
  history.push('/login');
};

How do I handle the redirect after logging out?

You can use the useHistory hook from react-router-dom to programmatically redirect the user after logging out. Just call history.push('/login') after clearing the user data.

Is there a way to confirm the logout action?

Yes, you can use a confirmation dialog before logging out. For example, you can use window.confirm('Are you sure you want to log out?') to prompt the user.