语言感知的 Nuxt.js 路由

For as long as I can remember, building multi-language websites is the norm in Egypt and catering for multi-language audience is an expectation rather than a “nice-to-have”.

据我所知，构建多语言网站在埃及是常态，为多语言受众提供支持是一种期望，而不仅仅是“好事”。

So even if you are starting on a project with a single language it will almost be required at some point to add multi-language support to it.

因此，即使您从单语言项目开始，几乎在某个时候都需要为其添加多语言支持。

In many applications you may be using right now, the user may set their preferred language via a setting that saves it to the cookies ensuring the app can always infer the current language preferred by the user. These types of applications usually do not include the language code in their URLs.

在许多您现在可能使用的应用程序中，用户可以通过设置来设置其首选语言，并将其保存到cookie中，以确保应用程序始终可以推断出用户首选的当前语言。这些类型的应用程序通常不在其URL中包含语言代码。

These are not the types of applications I’m talking about in this Article, I’m talking about web apps with URLs like this:

我在本文中所说的不是这些类型的应用程序，我所说的是具有以下URL的Web应用程序：

shhttps://example.com/en-US/about https://example.com/ar-EG/about

For these applications including the language code in the URL is a necessity because it helps each audience able to reach the content they would identify with the most. We tend to call this “search engine optimization” or as commonly refereed to as “SEO”.

对于这些应用程序，将语言代码包含在URL中是必要的，因为它可以帮助每个受众能够访问他们最感兴趣的内容。我们倾向于将其称为“搜索引擎优化”或常称为“SEO”。

Routing in Nuxt.js

Nuxt.js中的路由

We have various ways to redirect the current page in a Nuxt.js application. We have the traditional routing components:

在Nuxt.js应用程序中，我们有多种方法来重定向当前页面。我们有传统的路由组件：

vue <router-link to="/about">{{ $t('About') }}</router-link>  <nuxt-link to="/about">{{ $t('About') }}</nuxt-link>

vue <router-link to="/about">{{ $t('About') }}</router-link>  <nuxt-link to="/about">{{ $t('About') }}</nuxt-link>

Aside from that you you have programmatic navigation using vue-router instance methods:

除此之外，你...