1.0.4 • Published 5 years ago
modo-navigationbar v1.0.4
navigation-bar
Demo
Usage
install
npm install --save modo-navigationbarapp.json
{
"window": {
"navigationStyle": "custom"
}
}page/component.json
{
"usingComponents": {
"navigation-bar": "modo-navigationbar"
}
}Slots
| Name | Type | Default | Description |
|---|---|---|---|
| title | Dom | 自定义 当前页面标题。可以用图片 高度 40，宽度随意。 |
Properties
| Name | Type | Default | Description |
|---|---|---|---|
| navStyle | String | black | 设置导航条左上角图标及标题文字颜色。可选参数 'black', 'white'。 |
| textColor | String | 自定义标题文字颜色。设置该参数会覆盖 style 对标题文字的设置。 | |
| bgColor | String | #fffff | 自定义导航条背景颜色。 |
| borderBottomColor | String | 自定义导航条 border-bottom 颜色。 | |
| hasTabBar | Boolean | false | 当前项目是否有 tabBar 页面。该参数决定返回首页时使用 redirectTo 还是 switchTab。 |
| isTabBar | Boolean | false | 当前页面是否为 tabBar 页面。该参数决定左上角图标是否显示。 |
| isFixed | Boolean | true | 导航条是否在固定在页面头部。 |
| iconUri | String | 自定义图标资源链接。尺寸：40x40。设置该参数会覆盖 style 对图标颜色的设置。默认图标显示规则：页面栈长度 > 1：返回上页图标 / 页面栈长度 == 1：返回首页图标 / isTabBar：无图标。 | |
| homeUri | String | 设置首页 page uri。 | |
| useCustomHandler | Boolean | false | 是否自定义图标点击的回调事件。为 true 时，开发者需要监听 leftpage 事件。默认事件触发规则：页面栈长度 > 1：返回上页 / 页面栈长度 == 1：返回首页 / isTabBar：无事件]。 |
Events
| Name | Type | Default | Description |
|---|---|---|---|
| leftpage | bind | noop | 监听点击左上角icon的事件。仅在 useCustomHandler 为真时有效 |