Access this in head

[SvenC56]

Hello together

I'd like to access this in the head method to achieve something like this:

@Component({
  components: { AppSidebar, AppLoginDialog },
  asyncData({ $config }) {
    const appName: string = $config.app.name;
    const appShortName: string = $config.app.shortName;

    return {
      appName,
      appShortName,
    };
  },
  head: {
    titleTemplate: (titleChunk: string): string => {
      return titleChunk
          `${titleChunk} - ${this.appShortName || "Short"}`
          this.appName || "Title";
    },
  },
})
export default class EmptyLayout extends Vue {}

However this approach does not seem to work. Is there any other way to allow dynamic head (Besides in nuxt.config.ts)?

Thank you.

[SvenC56]

I found the solution here.