微信小程序怎么完成tabber界面

 时间:2026-02-15 10:55:11

1、我们第一步需要新建一个文件夹photo,将已经准悦伐备好了的图标放在文件夹内。

微信小程序怎么完成tabber界面

2、打开app.json,新建tabber项。代码如下:

 "pagePath": "攀信宙此处填页面的根目录",

 "text": "此处填文本,如“首页",

 "iconPath": "此处填的是图标路径",

 "selectedIconPath": "此处填的是被选中时的图标路径"。

微信小程序怎么完成tabber界面

3、完成一个tabber界面至少需要两个页面,两个图标。

如果需要四个,代码示例如下:

  "tabBar": {

    "selectedColor": "#C00000",

    "list": [

      {

        "pagePath": "pages/home/home",

        "text": "首页",

        "iconPath": "/static/static/tab_icons/home.png",

        "selectedIconPath": "/static/static/tab_icons/home-active.png"

      },

      {

        "pagePath": "pages/cate/cate",

        "text": "分类",

        "iconPath": "/static/static/tab_icons/cate.png",

        "selectedIconPath": "/static/static/tab_icons/cate-active.png"

      },

      {

        "pagePath": "pages/cart/cart",

        "text": "购物车",

        "iconPath": "/static/static/tab_icons/cart.png",

 鉴近       "selectedIconPath": "/static/static/tab_icons/cart-active.png"

      },

      {

        "pagePath": "pages/my/my",

        "text": "我的",

        "iconPath": "/static/static/tab_icons/my.png",

        "selectedIconPath": "/static/static/tab_icons/my-active.png"

      }

    ]

  • PS自由变换工具的运用介绍
  • PS将照片覆盖在纸盒上面的方法
  • 如何创建Vray太阳
  • 怎么用Photoshop自动合并到HDR Pro
  • 3DMAX晶格命令的运用~~~
  • 热门搜索
    北京旅游局官方网站 顺德旅游景点 钦州旅游景点大全 青岛旅游景点大全介绍 携程网 旅游 梵蒂冈旅游攻略 圣托里尼岛旅游攻略 日本京都旅游 韩国釜山旅游景点 延安旅游景点大全