锐客网

  1. 首页 > 睿知 > it技术 > >

uniapp——头部导航栏右侧图标+文字配置

IT知识Uniapp导航栏导航

人生处万类,知识最为贤。这篇文章主要讲述uniapp——头部导航栏右侧图标+文字配置相关的知识，希望能为你提供帮助。
示例图：

uniapp——头部导航栏右侧图标+文字配置

文章图片

 
 
 
在page.json配置即可
uniapp——头部导航栏右侧图标+文字配置

文章图片

{ "path": "pages/index/logs", "style": { "navigationBarTitleText": "日志", "app-plus": { "titleNView": { "buttons": [{ "text": "德基店", "fontSize": "14px", "color": "#222" },{ "text": "\\ue672", "fontSrc": "/static/uni.ttf", "fontSize": "18px", "color": "#222" },{ "type": "share", "fontSize": "20px" } ] } } } },

 
自定义页面跳转
onNavigationBarButtonTap(e) { //监听自定义导航栏按钮跳转页面 uni.navigateTo({ url:\'jsHistoryAdjustment\' }) },

 
  右侧按钮宽度调整
【uniapp——头部导航栏右侧图标+文字配置】
uniapp——头部导航栏右侧图标+文字配置

文章图片

 
 
  用宽度调整文字和图标之间的距离："width": "80px"
更多导航栏请点这里https://ask.dcloud.net.cn/article/34921
 

    推荐阅读


    上一篇：android studio 点击布局文件隐藏弹出的键盘。

    下一篇：把bitmap转成文件存入APP项目目录