uniapp开发微信小程序及钉钉小程序自定义导航栏

微信小程序

1.在文件pages.json中配置是否开启自定义导航栏

"pages": [
	// navbar-自定义导航栏
	{
		"path": "/pages/navbar/index",
		"style": {
			"navigationStyle": "custom" ,// 隐藏系统导航栏
			"navigationBarTextStyle": "white" // 状态栏字体为白色，
                                                    //只能为 white-白色，black-黑色 二选一
		}
	}
]

钉钉小程序

"pages": [
	// navbar-自定义导航栏
	{
		"path": "/pages/navbar/index",
		"style": {
			 "navigationBarTitleText": "",
                        "transparentTitle":“always”,定义标题栏透明
		}
	}
]
   

2.使用u-view组件u-navbar快速实现自定义导航栏

	<u-navbar 
        :is-back="true" 
        title="名师课堂" 
        :background="background" 
        back-icon-color='#000' 
        title-color='#333'
	title-bold='true'>
                <view class="slot-wrap">
                    ......
		</view>
	</u-navbar>