React - add unique class to <body> with useEffect

added Jan 19 in React by lcjr First Warrant Officer (11,990 points)

import React, { useEffect } from 'react';
import BuddyMain from '../components/buddy/BuddyMain';
import BuddySidebar from '../components/buddy/BuddySidebar';

const BuddyPage = () => {

  useEffect(() => {
    // Add a unique class to the body element when the component mounts
    document.body.classList.add('buddy');
  
    // Remove the class when the component unmounts
    return () => {
      document.body.classList.remove('buddy');
    };
  }, []);
  
  return (
    <div className="buddy-page">
      <div className="main">
        <BuddyMain />
      </div>
      <div className="sidebar">
        <BuddySidebar />
      </div>
    </div>
  );
};

export default BuddyPage;

React - add unique class to <body> with useEffect

Related reference