Nuxt SEO meta tags through head property or computed property

[rickgoemans]

In the Nuxt framework you can set the page's meta SEO tags by using the local settings way which is done through the head property or a head getter function.

This works as intended but the drawback is that I can't use any functions or this reference to my knownledge, and this is crucial for having the page title translated using Vuei18n.

Normal non class-style components definition:

<script>
export default {
    //...
    head() {
        return {
            title: this.$t('LOGIN_PAGE_TITLE'),
        }
    },
</script>

I've tried to rework in 3 options that I can think off, but all give errors related to not being able to reach this.title or something related to $t not being available:

TypeError: Cannot read properties of undefined (reading '_t')
    at Vue.$t (vue-i18n.esm.js?a925:236:1)
    at Vue.get (index.vue?0f48:126:1)
    at Vue.get (index.vue?0f48:121:1)
    at eval (vue-class-component.esm.js?2fe1:193:1)
    at Array.forEach (<anonymous>)
    at componentFactory (vue-class-component.esm.js?2fe1:186:1)
    at eval (vue-class-component.esm.js?2fe1:311:1)
    at __decorate (tslib.es6.js?9ab4:58:1)
    at eval (index.vue?0f48:102:1)

Class style component

<script lang="ts">
import {Compont, Vue} from 'nuxt-propery-decorator'

@Component({
    // OPTION 1.
    // head: {
    //     title: $t('LOGIN_PAGE_TITLE'), // Error: _t(...) not available 
    // },
    
    // OPTION 2.
    // head: {
    //     title: this.title, // Error: this.title not available
    // },
})
export default class LoginPage extends Vue {
    // OPTION 3.
    // get head() {
    //     return {
    //         title: this.$t('LOGIN_PAGE_TITLE'), // Error: _t(...) not available
    //     }
    // }

    // OPTION 4.
    // get head() {
    //    return {
    //        title: this.title, // Error on the computed property that _t(...) is not available
    //    }
    // }

    get title(): string {
        return this.$t('LOGIN_PAGE_TITLE').toString()
    }
</script>

Am I overlooking some basic thing or is it just not possible to achieve with class style components?

[rickgoemans]

Anybody with a suggestion? I'm still stuck at this issue