uniapp 多语言 中文tabbar和导航栏 不生效

uniapp 多语言 中文tabbar和导航栏 不生效
uniapp国际化多语言 已经设置完毕 但是tabbar和自定义导航栏按钮的文字不能切换中文,其他语言都能正常切换 唯独中文有这个问题,这是什么原因呢?
如下是在中文状态下:但是底下的tabbar和顶部按钮还是英文。

img

中文的json有配置

img

  • 你可以参考下这篇文章:uni-app设置tabbar不显示
  • 除此之外, 这篇博客: 【uniapp】微信小程序uniapp自定义底部导航栏中的 tabbar文件 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  • <template>
    	<view class="tab-block">
    		<ul
    			class='tab-list flex flex-center'
    			:class="showMiddleButton === true?'tab-list-middle':'tab-list-default'"
    		>
    			<li
    				v-for="(item, index) in tabList"
    				:class="'list-item flex flex-column flex-middle ' + item.middleClass"
    				@click="handlePush(item, index)"
    				:key="index"
    			>
    				<view class="item-img-box">
    					<image
    						class="item-img"
    						:src="tabIndex == index ? item.selectedIconPath : item.iconPath"
    					/>
    				</view>
    				<view class="item-text font-20 color-black"
    					:class="{ specialColor: tabIndex == index}"
    				>
    					{{item.text}}
    				</view>
    			</li>
    		</ul>
    		
    		<!-- 兼容iPhonex下面的小黑条 -->
    		<view class="tab-bar" v-show="showTabBar === true"></view>
    	</view>
    </template>
    
    <script>
    	export default {
    		props: {
    			tabIndex: { //当前选中的tab项
    				type: Number,
    				default: 0
    			}
    		},
    		data() {
    			return {
    				/*
    				 * iconPath: 默认icon图片路径
    				 * selectedIconPath: 选中icon图片路径 
    				 * text: tab按钮文字
    				 * pagePath:页面路径
    				 * middleClass:该按钮所有的特殊样式类名
    				 * tabList最小两项,最多五项
    				 * tabList长度为奇数时,中间按钮才会突出显示
    				 * 
    				 */
    				tabList: [{
    						iconPath: '/static/tabbar/index.png',
    						selectedIconPath: "/static/tabbar/index_a.png",
    						text: '首页',
    						pagePath: '/pages/index/index',
    						middleClass: ''
    					},
    					{
    						iconPath: '/static/tabbar/activity.png',
    						selectedIconPath: '/static/tabbar/activity_a.png',
    						text: '活动',
    						pagePath: '/pages/activity/activity',
    						middleClass: ''
    					},
    					{
    						iconPath: '/static/tabbar/tabbar-logo.png',
    						selectedIconPath: '/static/tabbar/tabbar-logo.png',
    						text: '商城',
    						pagePath: '/pages/shop/shop',
    						middleClass: ''
    					},
    					{
    						iconPath: '/static/tabbar/shopCar.png',
    						selectedIconPath: '/static/tabbar/shopCar_a.png',
    						text: '购物车',
    						pagePath: '/pages/shopCar/shopCar',
    						middleClass: ''
    					},
    					{
    						iconPath: '/static/tabbar/mine.png',
    						selectedIconPath: '/static/tabbar/mine_a.png',
    						text: '我的',
    						pagePath: '/pages/mine/mine',
    						middleClass: ''
    					}
    				],
    				showTabBar: false,
    				showMiddleButton: false,
    			};
    		},
    		computed: {
    			getHeight() {
    				return Number(this.height);
    			},
    		},
    		mounted() {
    			this.getSystemInfo()
    			this.setTabBar()
    		},
    		methods: {
    			//判断中间按钮是否突出显示,奇数or偶数,奇数突出
    			setTabBar(){
    				let tabLength = this.tabList.length
    				if (tabLength % 2) {
    					debugger
    					this.showMiddleButton = true
    					// 向上取整
    					let middleIndex = Math.floor(tabLength / 2)
    					// 给中间的添加mid-button
    					this.tabList[middleIndex].middleClass = 'mid-button'
    				}
    			},
    			
    			//点击按钮
    			handlePush(item, index) {
    				if (this.tabIndex !== index) {
    					uni.switchTab({
    					    url: item.pagePath
    					})	
    				}
    			},
    			
    			//兼容iPhoneX以上底部黑线条的显示
    			getSystemInfo() {
    				//获取系统信息
    				uni.getSystemInfo({
    					success: (res) => {
    						// X及以上的异形屏top为44,非异形屏为20
    						if (res.safeArea.top > 20) {
    							this.showTabBar = true
    						}
    					}
    				});
    			},
    		}
    	}
    </script>
    
    <style lang="scss">
    	.specialColor{
    		color: rgb(229, 113, 1);
    	}
    	.flex {
    		display: flex;
    		flex-flow: row wrap;
    	}
    
    	.flex-center {
    		align-items: center;
    		justify-content: center;
    	}
    
    	.flex-column {
    		flex-direction: column;
    	}
    
    	.flex-middle {
    		align-items: center;
    	}
    	.font-20 {
    		font-size: 20rpx;
    	}
    	.tab-block {
    		position: fixed;
    		bottom: 0;
    		left: 0;
    		z-index: 999;
    		background-size: contain;
    		width: 100vw;
    		.tab-list{
    			height:100rpx;
    		}
    		.tab-list-default{
    			background-color: #FFFFFF;
    			border-top: 1px #dddddd solid;
    		}
    		.tab-list-middle {
    			position: relative;
    			background: url('https://res.paquapp.com/popmartvip/home/nav_bar_bg_2x.png') no-repeat center center;
    			background-size: cover;
    		}
    		.list-item {
    			flex: 1;
    			.item-img-box {
    				width: 44rpx;
    				height: 42rpx;
    				margin-bottom: 9rpx;
    				position: relative;
    			}
    
    			.item-img {
    				width: 44rpx;
    				height: 42rpx;
    			}
    		}
    
    		.mid-button {
    			position: relative;
    
    			.item-img-box {
    				width: 106rpx;
    				height: 106rpx;
    				margin-bottom: 9rpx;
    				position: absolute;
    				z-index: 1002;
    				top: -104rpx;
    			}
    
    			.item-img {
    				width: 106rpx;
    				height: 106rpx;
    			}
    
    			.item-text {
    				font-size: 20rpx;
    				position: absolute;
    				z-index: 1002;
    				bottom: -40rpx;
    			}
    		}
    
    		.tab-bar {
    			height: 30rpx;
    			background-color: #FFFFFF;
    		}
    	}
    </style>
    
  • 您还可以看一下 李杰老师的Uni-app(uniapp)入门基础与实战+赠送仿美团微信点餐小程序课程中的 自定义tabBar及封装tabBar组件小节, 巩固相关知识点

请问解决了吗 我也是遇到这个问题 我在h5和小程序上都是生效的 但是在app上tabbar就不生效

可能是由于你的中文语言包未能正确地加载导致的。可以检查中文语言包是否已经正确导入并被识别。另外,你也可以尝试重新编译一下项目,确保中文语言包被正确地打包进去。