您的当前位置:首页正文

小程序自定义tabbar的两种方式

2024-11-25 来源:个人技术集锦

小程序自定义tabbar

先做一下效果展示吧

本案例是按照官网来做的

app.js代码:

下面的list,官网说是必须的,但我感受不到它的用处

"tabBar": {
   
    "custom": true,
    "color": "#000000",
    "selectedColor": "#000000",
    "backgroundColor": "#000000",
    "borderStyle": "white",
    "list": [
      {
   
        "pagePath": "pages/page/index",
        "text": "首页",
        "iconPath": "/imgs/tab.png",
        "selectedIconPath": "/imgs/tab.png"
      },
      {
   
        "pagePath": "pages/scroll/index",
        "text": "滚动",
        "iconPath": "/imgs/tab.png",
        "selectedIconPath": "/imgs/tab.png"
      }
    ]
  },
  "usingComponents": {
   }
tabbar组件的创建
custom-tab-bar/index.js代码
data: {
   
  curIndex: 
显示全文