Magento 2 PWA Update <title> in custom component

Question

How to update the title tag in the Head ?

Really don't want to mess around with the DOM updating with javascript!

Answer 1

To update <title> tag in custom component:

import { Meta, Title } from 'location-to-head-component/lib/components/Head';

Then return:

return (
        <>
            <Title>you-title-here - {yourVar}</Title>
            //page content here
        </>
    );

OR:

useEffect(() => {
      document.title = 'you-title-here - '+yourVar;
   }, [title]);