微信小程序header
时间: 2023-10-02 15:11:56 浏览: 52
微信小程序的 header 是指小程序顶部的导航栏,包括小程序的标题、左侧返回按钮、右侧菜单按钮等。在小程序开发中,可以通过设置页面的 navigationBarTitle 和 navigationStyle 来自定义 header 样式。
navigationBarTitle 可以设置小程序的标题,例如:
```
Page({
onLoad: function () {
wx.setNavigationBarTitle({
title: '页面标题'
})
}
})
```
navigationStyle 可以设置 header 样式,包括 default(默认样式)、custom(自定义样式)和 customUsedBack(自定义样式并且使用返回按钮)等。例如:
```
Page({
onLoad: function () {
wx.setNavigationBarColor({
frontColor: '#ffffff',
backgroundColor: '#ff0000',
animation: {
duration: 400,
timingFunc: 'easeIn'
}
})
wx.setNavigationBarStyle({
backgroundColor: '#ffffff',
borderBottomColor: '#cccccc'
})
}
})
```
以上代码设置了小程序 header 的背景色、底部边框颜色、前景色等样式。