Vue 3: update document.title based on computed property in router-view-component

Question

Following situation:

my app.html features a <router-view>-tag.

For most routes the document.title would be static, but for one route it would be desirable if the document.title would dynamically update based on a computed property name of the component that is used in the router-view.

Existing thoughts:

• change the title in the computed-values handler-method while setting the static titles or a default value in the routers afterEach (understandably my colleague doesn't like the idea of the component actively changing the title for reasons of encapsulation, he sees that as a responsibility of app.js or the router, I don't see it as a responsibility of the router because the example at hand shows a case that doesn't necessarily imply activity of the router at all)
• triggering an event that could be caught by app.js to then change the title while setting the static titles or a default value in the router's afterEach
• in app.js watch the computed property in the router-view-component to handle necessary changes (not sure how and if this would even work technically without becoming unwieldy as the computed property wouldn't even have to exist on each component that could be inserted in the router-view)

All of this seems hacky to me to be honest.

Is there an elegant way to achieve this?

(If any more information is needed, please ask for it and and I will try to provide it)