WeChat ミニ プログラムのタブバーの設定

1.タブバーの作成

ではapp.json、タブバーは次のように設定されます。

"tabBar": {
    "color": "#8a8a8a",
    "selectedColor": "#1296db",
    "backgroundColor": "#e6e6e6",
    "list": [
      {
        "pagePath": "pages/home/home",
        "text": "首页",
        "iconPath": "/images/tabs/main.png",
        "selectedIconPath": "/images/tabs/main1.png"
      },
      {
        "pagePath": "pages/logs/logs",
        "text": "消息",
        "iconPath": "/images/tabs/message.png",
        "selectedIconPath": "/images/tabs/message1.png"
      },
      {
        "pagePath": "pages/mine/mine",
        "text": "我的",
        "iconPath": "/images/tabs/main.png",
        "selectedIconPath": "/images/tabs/main1.png"
      }
    ]
  },

tabbarページと同じレベル

2. ホームページを設定してアクセスします

 "pages":[
    "pages/home/home",
    "pages/index/index",
    "pages/mine/mine"
  ],

デフォルトで選択されているタブを変更する場合は、「pages」配列内の順序を変更するだけで済みます。最初に配置されたものが最初に選択されます。
たとえば、「mine」インターフェイスを最初に表示したい場合、ページ内のインターフェイスを次の順序に変更できます。

"pages":[
    "pages/mine/mine",
    "pages/home/home",
    "pages/index/index"
  ],