WeChat applet development tab (TabBar at the bottom of the window) page switch implementation

This article describes how to switch the tabs (TabBar at the bottom of the window) of Applet development. It has good reference value. Next, let's take a look at it. This article mainly introduces the knowledge of page switching on the tabs of Applet development (TabBar at the bottom of the window. It has good reference value. Let's take a look at it with the small editor.

In applet development, it is very convenient to switch the tab bar at the bottom of the window to the page.

// App. json {"pages": ["pages/index", "pages/logs"], "window": {"backgroundTextStyle": "light ", "navigationBarBackgroundColor": "#999999", "navigationBarTitleText": "tab", "navigationBarTextStyle": "white"}, "tabBar": {"color": "# ccc ", "selectedColor": "# 35495e", "borderStyle": "white", "backgroundColor": "# f9f9f9", "list": [{"text": "homepage ", "pagePath": "pages/index", "iconPath": "images/home.png", "selectedIconPath": "images/home-actived.png" },{ "text ": "directory", "pagePath": "pages/catalogue", "iconPath": "images/note.png", "selectedIconPath": "images/note-actived.png "}, {"text": "My", "pagePath": "pages/mine", "iconPath": "images/profile.png", "selectedIconPath ": "images/profile-actived.png"}]}

PagePath is the page path. iconPath is the image path, and the icon size is limited to 40 KB.

SelectedIconPath: specifies the image path when the image is selected. the icon size is limited to 40 KB.

The maximum number of tabs is 5, and the minimum number is 2.

Write the page in the pages directory to switch.

The preceding figure shows the implementation of page switching on the tab (TabBar at the bottom of the window) of Applet development. For more information, see other related articles in the first PHP community!