当我们构建多语言站点时,管理和维护分散的语言文件很不方便。npm 包 keystone-multilingual 可以帮助我们将多语言内容存储在数据库中,便于管理和维护,同时提供了许多方便的 API。
安装
在项目根目录下执行以下命令:
npm install keystone-multilingual
使用
在 keystone.js 中引入 keystone-multilingual:
const keystoneMultilingual = require('keystone-multilingual');
定义多语言模型:
-- -------------------- ---- ------- --------------------------- -------- --------- ------ -------------- -------- ---------- -------------------- ------------ ---------------- -------------------- ------------------ --- ----- ---- - ---------------------------- ------------------------------------
其中:
locales
: 所有的语言类型,这里有'zh-cn'
和'en'
两种;defaultLocale
: 默认语言,这里是zh-cn
。modelsDir
: 多语言模型所在目录,这里是./models
;translationsDir
: 多语言文件所在目录,这里是./translations
。
keystoneMultilingual.register
接收要进行多语言化的模型,这里是 Post
。
在 ./models/Post.js
中,根据需要添加多语言字段:
-- -------------------- ---- ------- ----- - -------- - - ------------------------------------ ----- - ----- - - --------------- ----- ---- - --- ---------------------- ---------- ------ - ----- ----------- --------- ----- -------- ----- -- --- ----------------- -------------- - ----- ----------- ------ --------- --------- ----- -------- ----- -- ----------- - ----- ----------- ------ ------------ --------- ----- -------- ----- -- --- ---------------- - ------------- ------------------- - ------------- --------- ----------- ----------------
这里添加了多语言标题,并在 schema
中添加了 'title.zh-cn'
和 'title.en'
两个字段。
如此,我们就完成了一个多语言化的模型。
接下来,在控制器中添加多语言处理:
-- -------------------- ---- ------- ----- -------------------- - --------------------------------- ----- ---- - ---------------------------- --------------- - ----- ----- ---- ----- -- - ----- - -- - - ----------- --- ----- --- - ---- - ----- ------------------ - ----- ----- - ------ ---------- - -- ------- - ------ ----------------------- - ----- ------ - ------------------------------------ ----------------------------------------- -------- --------------- - ----- ------- --
其中:
keystoneMultilingual.getLocale(req)
从请求中获取当前语言;keystoneMultilingual.translateModel(post, locale)
完成多语言翻译。
在模板文件中,我们可以这样使用翻译:
<h1>{{ post.title }}</h1>
模板引擎会自动根据当前语言显示正确的翻译内容。
示例代码
./models/Post.js
:
-- -------------------- ---- ------- ----- - -------- - - ------------------------------------ ----- - ----- - - --------------- ----- ---- - --- ---------------------- ---------- ------ - ----- ----------- --------- ----- -------- ----- -- --- ----------------- -------------- - ----- ----------- ------ --------- --------- ----- -------- ----- -- ----------- - ----- ----------- ------ ------------ --------- ----- -------- ----- -- --- ---------------- - ------------- ------------------- - ------------- --------- ----------- ----------------
./controllers/postController.js
:
-- -------------------- ---- ------- ----- -------------------- - --------------------------------- ----- ---- - ---------------------------- --------------- - ----- ----- ---- ----- -- - ----- - -- - - ----------- --- ----- --- - ---- - ----- ------------------ - ----- ----- - ------ ---------- - -- ------- - ------ ----------------------- - ----- ------ - ------------------------------------ ----------------------------------------- -------- --------------- - ----- ------- --
./views/post.hbs
:
<h1>{{ post.title }}</h1>
这样,我们就完成了 keystone-multilingual 的使用教程。希望能对你的前端开发工作有所帮助。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005592181e8991b448d6947