NavBar 导航
使用指南
在 app.json 或 index.json 中引入nav-bar组件
{
"usingComponents": {
"fs-nav-bar": "../../components/nav-bar/index"
}
}
1
2
3
4
5
2
3
4
5
代码演示
- 基本使用
<fs-nav-bar
title="按钮"
leftText="返回"
rightText="文本"
bind:click-left="handleLeft"/>
1
2
3
4
5
2
3
4
5
- 高级使用
<fs-nav-bar>
<span slot="left">上一页</span>
<span slot="middle">这是标题</span>
<span slot="right">
搜索
</span>
</fs-nav-bar>
1
2
3
4
5
6
7
2
3
4
5
6
7
属性
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| title | 中间标题文字 | String | - |
| left-arrow | 是否显示左侧箭头 | Boolean | - |
| left-text | 左侧文字 | String | - |
| right-text | 右侧文字 | String | - |
| fixed | 是否固定到顶端 | Boolean | - |
| z-index | z-index | String | Number |
插槽
| 插槽名 | 说明 |
|---|---|
| left | 左侧内容 |
| middle | 中间标题 |
| right | 右侧内容 |
事件
| event | 说明 | 返回值 |
|---|---|---|
| click-left | 点击左侧文字 | event |
| click-right | 点击右侧文字 | event |