Looking to localize the text displayed on v-text-field and vuetify-google-autocomplete components in Vuetify. Here's a snippet of the code:
<template>(...)
<v-text-field
label="$t('common.nameLabel')"
v-model="registerName"
required
></v-text-field>
<vuetify-google-autocomplete
ref="registerAddress"
id="map"
dark
label="registerAddressLabel"
google-api-key="Xyz"
v-on:placechanged="getAddressData"
>
</vuetify-google-autocomplete>
(...)</template>
<script>
import VuetifyGoogleAutocomplete from 'vuetify-google-autocomplete'
export default {
data () {
return {
registerAddressLabel () {
return this.$t('common.addressLabel')
},
registerAddress: '',
registerEmail: '',
registerPassword: '',
registerName: ''
}
},
methods: {
getAddressData (addressData, placeholderResultData) {
}
},
components: {
VuetifyGoogleAutocomplete
}
}
</script>
The issue arises when trying to translate labels using $t() as seen with $t('common.nameLabel'). It seems to not recognize it as a function. Is there a way to consistently translate all labels in this manner?