欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 汽车 > 维修 > vue2切换中英文但是菜单栏与面包屑无变化

vue2切换中英文但是菜单栏与面包屑无变化

2024/10/24 16:28:58 来源:https://blog.csdn.net/weixin_45865992/article/details/141351734  浏览:    关键词:vue2切换中英文但是菜单栏与面包屑无变化

面包屑

<template><el-breadcrumb class="app-breadcrumb" separator="/"><transition-group name="breadcrumb"><el-breadcrumb-item v-for="(item,index) in levelList" v-if="item.meta.title" :key="item.path"><span v-if="item.redirect==='noredirect'||index==levelList.length-1" class="no-redirect"> {{ generateTitle(item.meta.title) }}</span><router-link v-else :to="item.redirect||item.path">{{ generateTitle(item.meta.title) }}</router-link></el-breadcrumb-item></transition-group></el-breadcrumb>
</template>
import { generateTitle } from "@/utils/i18n";
  methods: {getBreadcrumb() {//这个方法里面就按照你自己的路由判断},//引入这个就行generateTitle}

菜单栏是一样的,我直接放了一整块的代码,按照相应的改就行,主要也是用的generateTitle

<template><div v-if="!item.hidden":class="parentActive(item)?'isActive menu-wrapper':'menu-wrapper' "@click="selectCurr(item)"><templatev-if="hasOneShowingChild(item.children,item)&& (!onlyOneChild.children||onlyOneChild.noShowingChildren) &&!item.alwaysShow"><app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path)"><el-menu-item :index="resolvePath(onlyOneChild.path)":class="{'submenu-title-noDropdown':!isNest}"><item :icon="onlyOneChild.meta.icon||(item.meta&&item.meta.icon)":title="generateTitle(onlyOneChild.meta.title)" /></el-menu-item></app-link></template><el-menu-item v-else ref="subMenu":index="resolvePath(item.path)" popper-append-to-body><div slot="title" @click="current(item)"><item v-if="item.meta":icon="item.meta && item.meta.icon":title="generateTitle(item.meta.title)" /></div></el-menu-item></div>
</template><script>
import path from 'path'
import { generateTitle } from '@/utils/i18n'
import { isExternal } from '@/utils/validate'
import Item from './Item'
import AppLink from './Link'
import FixiOSBug from './FixiOSBug'export default {name: 'SidebarItem',components: { Item, AppLink },mixins: [FixiOSBug],props: {item: {type: Object,required: true},isNest: {type: Boolean,default: false},basePath: {type: String,default: ''}},data() {this.onlyOneChild = null;return {currentname:''}},methods: {current(item){this.$router.push(item.redirect);},parentActive(item){//选中出发二级let itemChildren = item.children;if(itemChildren && itemChildren.length>0){for(let idx in itemChildren){let child = itemChildren[idx];let currPath = this.resolvePath(child.path);if(currPath === this.$route.path){this.selectCurr(item);return true;}}}},selectCurr(routerObj){let hasOne = this.hasOneShowingChild(routerObj.children,routerObj);if(!hasOne){//有子项this.$emit("retParentObj",routerObj);}else{this.$emit("retParentObj",null);}},hasOneShowingChild(children = [], parent) {const showingChildren = children.filter(item => {if (item.hidden) {return false} else {this.onlyOneChild = item;return true}});if (showingChildren.length === 1) {return true;}if (showingChildren.length === 0) {this.onlyOneChild = { ... parent, path: '', noShowingChildren: true };return true;}return false;},resolvePath(routePath) {if (isExternal(routePath)) {return routePath;}if (isExternal(this.basePath)) {return this.basePath;}return path.resolve(this.basePath, routePath);},generateTitle}
}
</script><style scoped>.el-menu-item{font-size: 14px;/*font-weight: 600;*/}.none{color: bfcbd9;}.blue{color: #1890ff;}</style>

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com