当前位置:   article > 正文

uniapp -- tabBar_unapp tabbar 排序

unapp tabbar 排序

tabBar : 底部tab切换

  1. 当设置 position 为 top 时,将不会显示 icon。
  2. tabBar 中的 list 是一个数组,只能配置最少2个、最多5个 tab,tab 按数组的顺序排序。
  3. 代码跳转到 tabbar 页面,只能使用uni.switchTab,不能使用uni.navigateTo、uni.redirectTo;使用navigator组件跳转时必须设置open-type="switchTab"
  4. navigationStyle : 导航栏样式,仅支持 default/custom。custom即取消默认的原生导航栏。(用uniapp开发小程序时必须取消默认导航栏)。
  5. enablePullDownRefresh :是否开启下拉刷新。

在page.json中添加以下代码:

  1. {
  2. "easycom": {
  3. "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
  4. },
  5. "pages": [
  6. {
  7. "path": "pages/index/index",
  8. "style": {
  9. "navigationBarTitleText": "首页",
  10. "enablePullDownRefresh": false,
  11. "navigationStyle": "custom"
  12. }
  13. },
  14. {
  15. "path": "pages/my/index",
  16. "style": {
  17. "navigationBarTitleText": "我的",
  18. "enablePullDownRefresh": false,
  19. "navigationStyle": "custom"
  20. }
  21. }
  22. ],
  23. "globalStyle": {
  24. "navigationBarTextStyle": "black",
  25. "navigationBarTitleText": "uni-app",
  26. "navigationBarBackgroundColor": "#F8F8F8",
  27. "backgroundColor": "#F8F8F8",
  28. "app-plus": {
  29. "background": "#efeff4"
  30. }
  31. },
  32. "tabBar": {
  33. "color": "#999999",
  34. "selectedColor": "#000000",
  35. "backgroundColor": "#ffffff",
  36. "list": [{
  37. "pagePath": "pages/index/index",
  38. "iconPath": "static/image/icon-index.png",
  39. "selectedIconPath": "static/image/icon-index-active.png",
  40. "text": "首页"
  41. }, {
  42. "pagePath": "pages/my/index",
  43. "iconPath": "static/image/icon-my.png",
  44. "selectedIconPath": "static/image/icon-my-active.png",
  45. "text": "我的"
  46. }]
  47. }
  48. }

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/菜鸟追梦旅行/article/detail/86407
推荐阅读