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.
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?
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 ahead
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:
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:Class style component
Am I overlooking some basic thing or is it just not possible to achieve with class style components?