vue router中如何使用i18n

最新推荐文章于 2026-06-10 11:47:10 发布

原创

最新推荐文章于 2026-06-10 11:47:10 发布 · 3k 阅读

标签

#vue.js

收录于

本文介绍了在 Vue.js 项目中，特别是在 Vue Router 中如何集成和使用 i18n 国际化功能。首先，详细阐述了准备工作，包括安装相应的插件，创建并准备翻译文件，全局引用以及在页面局部的应用。接着，提到了在 `router/index.ts` 文件中的配置，并且讨论了 `menu.vue` 文件中如何实现 i18n 支持。参考链接提供了更深入的教程。

1)准备工作

安装插件 => 准备翻译文件 => 全局引用 => 页面局部使用
详见下链接 [如何在vue3中使用后i18n]

https://blog.csdn.net/weixin_39423672/article/details/118327547?spm=1001.2014.3001.5502

2）router/index.ts

import {
   
    createRouter, createWebHashHistory, RouteRecordRaw } from "vue-router";

const routes: Array<RouteRecordRaw> = [
  {
   
   
    path