Accessing i18next
Similar to the $t()
function you can access the i18next instance as $i18next
in your components.
Wait for i18next to be initialized
vue
<template>
<div v-if="$i18next.isInitialized">
<h1>A test in {{ $i18next.language }}</h1>
<p>Translation {{ t("insurance") }}</p>
</div>
</template>
Change the language in a component
vue
<template>
<div>
<a v-on:click="changeLanguage('de')">DE</a>
</div>
</template>
<script>
export default {
methods: {
changeLanguage(lang) {
this.$i18next.changeLanguage(lang);
}
}
};
</script>
Change the language globally
javascript
import i18next from 'i18next';
...
i18next.changeLanguage('it');