- Notifications
You must be signed in to change notification settings - Fork433
Open
Description
In the Nuxt framework you can set the page's meta SEO tags by using the local settings way which is done through thehead property or ahead getter function.
This works as intended but the drawback is that I can't use any functions orthis 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 reachthis.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
<scriptlang="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// },})exportdefaultclassLoginPageextendsVue{// 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// }// }gettitle():string{returnthis.$t('LOGIN_PAGE_TITLE').toString()}</script>
Am I overlooking some basic thing or is it just not possible to achieve with class style components?
Metadata
Metadata
Assignees
Labels
No labels