vue-admin-template使用教程

最新推荐文章于 2025-06-01 09:03:20 发布

云上碧霄

最新推荐文章于 2025-06-01 09:03:20 发布

阅读量3.8k

点赞数 3

CC 4.0 BY-SA版权

分类专栏： element-ui 文章标签： vue.js 前端

本文链接：https://blog.youkuaiyun.com/cmax007/article/details/114437468

element-ui 专栏收录该内容

5 篇文章

订阅专栏

本文档指导如何将Vue项目中的Element UI组件库设置为中文，并详细说明了如何在`main.js`文件中取消注释以启用中文语言包。同时，介绍了在`@/router/index.js`中修改侧边栏选项为中文的方法，包括设置路由的`title`属性以显示中文名称。此外，还展示了如何在`src/components/Breadcrumb`中修改面包屑导航的中文标题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、将英文修改为中文，找到src/main.js文件，

// set ElementUI lang to EN
//Vue.use(ElementUI, { locale })
// 如果想要中文版 element-ui，按如下方式声明
Vue.use(ElementUI)  //取消该行注释

2、修改侧边栏选项为中文，在 @/router/index.js，设置title为中文。

meta: {
  roles: ['admin', 'editor'] // 设置该路由进入的权限，支持多个权限叠加
  title: 'title' // 设置该路由在侧边栏和面包屑中展示的名字
  icon: 'svg-name' // 设置该路由的图标，支持 svg-class，也支持 el-icon-x element-ui 的 icon
  noCache: true // 如果设置为true，则不会被 <keep-alive> 缓存(默认 false)
  breadcrumb: false //  如果设置为false，则不会在breadcrumb面包屑中显示(默认 true)
  affix: true // 如果设置为true，它则会固定在tags-view中(默认 false)
}

3、修改dashboard面包屑为中文

// src/component/breadcrumb

if (!this.isDashboard(first)) {
   matched = [{ path: '/dashboard', meta: { title: '首页' }}].concat(matched)
}