How do you pass a callback function from hookrouter as a property to a react component?

Question

I want to pass a callback function into a component that is a target of a hookrouter route.

I have been googling this for some time and the responses are all related to react-router instead. I need info specific to hookrouter.

The callback function is defined in my app.js component, as is my routing object. I want all of my content page components to be able to call this function to set the value of the page heading, which is rendered by app.js.

I've tried

'/': () => <Home setSubheading = {setSubheading} />,

as it would be done in react-router, but the component shows it as undefined.

I've also tried

'/': ({setSubheading}) => <Home setSubheading = {setSubheading} />,

and it shows

TypeError: _ref is null

The function and the state definition are defined like this.

const [subhdg, setSubhdg] = useState("Pending");
const setSubheading = (value) => {
    setSubhdg(value);
  }