uView(Tabbar 底部导航栏)

(一)第一种方式

1,每个菜单页面都要

“首页” “发布” “我的” 每个页面都要





2,pages.json页面
{
	"easycom": {
		"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
	},
	"pages": [
		{
			"path": "pages/index/index",
			"style": {
				"navigationBarTitleText": "首页"
			}
		}
	    ,{
            "path" : "pages/user/user",
            "style" :                                                                                    
            {
                "navigationBarTitleText": "我的",
                "enablePullDownRefresh": false
            }
            
        }
        ,{
            "path" : "pages/release/release",
            "style" :                                                                                    
            {
                "navigationBarTitleText": "发布",
                "enablePullDownRefresh": false
            }
            
        }
    ],
	// 原生的导航
	"tabBar": {
		// 需要时HexColor,设置成red 无法识别,下方颜色设置同理
		// "color":"#000",
		// "backerStyle":"white",
		// "selectedColor":"#555",
		// "backgroundColor": "#e6e6e6",
		"list": [{
				"pagePath": "pages/index/index"
			},
			{
				"pagePath": "pages/user/user"
			},
			{
				"pagePath": "pages/release/release"
			}
		]
	},
}

注意

(1)一定要添加 “tabBar” !!!!!
(2) “tabBar” 名称要和 .vue页面里面 onLoad 的 this.onLoad 想通!!!!

你可能感兴趣的:(vue,小程序,vue,uni-app,uView)