How to add a class to body only a route

I have a class called: product-page-bottom-padding

now I want to add this class only /product/{slug} route to body element. It must removing in other routes.

How to handle this scenario?

Answer

You can add the class to the body in the useEffect hook of component which you are rendering for /product/{slug} something like:

function ChildComponent() {
   useEffect(() => {
      document.body.classList.add("product-page-bottom-padding");
      
      return () => {
         document.body.classList.remove("product-page-bottom-padding");
      }
   }, [])
// other body
}