解决小程序自定义tabbar栏切换闪屏的效果（uniapp自定义同样解决）

话不多说，直接上代码解决问题

自定义导航栏的时候会定义一个tabbar的页面，如下：（需求不一样代码不一样，大致效果是一样的）

		
				
				
				首页
		
		
				
				
				推荐
		
		
			
		
		
			
			
			消息
		
		
			
			
			我的
		
	


onChange(index){
				if(index == 1){
					wx.switchTab({
						url:'../../pages/index/index'
					})
				}else if(index == 3){
					this.$emit('releasePopup')
				}else if(index == 2){
					wx.switchTab({
						url:'../../pages/recommend/recommend'
					})
				}else if(index == 5){
					wx.switchTab({
						url:'../../pages/center/center'
					})
				}else if(index == 4){
					wx.switchTab({
						url:'../../pages/message/message'
					})
				}
			}

在pages.json中定义tabbar

"tabBar":{
		"color": "#646D7E",
		"selectedColor": "#4A8CF5",
		"list":[
			{
				"pagePath": "pages/index/index",
				"text": "首页",
				"iconPath": "/static/[email protected]",
				"selectedIconPath": "/static/[email protected]",
				"clas": "#646D7E",
				"selectedColor": "#4A8CF5"
			},
			{
				"pagePath": "pages/recommend/recommend",
				 "text": "推荐",
				 "iconPath": "/static/[email protected]",
				 "selectedIconPath": "/static/[email protected]",
				 "clas": "#646D7E",
				 "selectedColor": "#4A8CF5"
			},
			{
				"pagePath": "pages/message/message",
				 "text": "消息",
				 "iconPath": "/static/[email protected]",
				 "selectedIconPath": "/static/[email protected]",
				 "clas": "#646D7E",
				 "selectedColor": "#4A8CF5"
			},
			{
				"pagePath": "pages/center/center",
				 "text": "我的",
				 "iconPath": "/static/[email protected]",
				 "selectedIconPath": "/static/[email protected]",
				 "clas": "#646D7E",
				 "selectedColor": "#4A8CF5"
			}
		]
	},

在app.js中

onShow: function() {
			wx.hideTabBar()
		},

如果不放心就在每个tabbar的页面的onshow方法中同样加上这行代码

这样就完美的解决了

这里面关键的就是跳转的页面的方式是switchTab，但是你没有在pages.json中定义Page.josn里定义tabbar时是不会跳转的，所以必须在page.json里定义tabbar，然后在app.js里将tabbar隐藏掉

在uniapp里面的时候也是一样的解决办法 就是把wx换成uni