如何在Nuxt js国际化(i18n)示例解释中触发语言?

时间:2017-07-03 19:14:40

标签: javascript vue.js vuejs2 nuxt.js

在Nuxt.Js doc中,有一个国际化的例子(i18n)。我得到了大部分内容,但我没有得到的是如何点击导航栏菜单上的语言选项更改来自' en'到了' fr'反之亦然,这会触发语言交换。

以下是代码: https://nuxtjs.org/examples/i18n

默认布局

<nuxt-link class="Header__Link" v-if="$i18n.locale === 'en'" :to="`/fr` + $route.fullPath" active-class="none" exact>
     {{ $t('links.french') }}
</nuxt-link>
<nuxt-link class="Header__Link" v-else :to="$route.fullPath.replace(/^\/[^\/]+/, '')" active-class="none" exact>
     {{ $t('links.english') }}
</nuxt-link>

这是现场演示: https://i18n.nuxtjs.org/

有人请关心解释吗?

感谢。

1 个答案:

答案 0 :(得分:1)

它使用vue-i18n。看看plugins/i18n.jsmiddleware/i18n.js。因此,在访问/fr/...时,商店中的区域设置设置为fr