feat: 切换至自定义 tabbar 模式并且编写页面使用 tabbar

miniprogram/app.json

@@ -1,11 +1,43 @@
 {
-  "pages": ["pages/date/date", "pages/login/login", "pages/index/index"],
+  "pages": [
+    "pages/date/date",
+    "pages/login/login",
+    "pages/index/index",
+    "pages/one/index",
+    "pages/two/index",
+    "pages/three/index",
+    "pages/four/index"
+  ],
   "window": {
     "navigationStyle": "default",
     "navigationBarTextStyle": "black",
     "navigationBarBackgroundColor": "#ffffff",
     "navigationBarTitleText": "My Weapp Template"
   },
+  "tabBar": {
+    "custom": true,
+    "color": "#000000",
+    "selectedColor": "#000000",
+    "backgroundColor": "#000000",
+    "list": [
+      {
+        "pagePath": "pages/one/index",
+        "text": "页面一"
+      },
+      {
+        "pagePath": "pages/two/index",
+        "text": "页面二"
+      },
+      {
+        "pagePath": "pages/three/index",
+        "text": "页面三"
+      },
+      {
+        "pagePath": "pages/four/index",
+        "text": "页面四"
+      }
+    ]
+  },
   "style": "v2",
   "renderer": "webview",
   "componentFramework": "glass-easel",

miniprogram/pages/four/index.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

miniprogram/pages/four/index.scss

@@ -0,0 +1 @@
+/* pages/four/index.wxss */

miniprogram/pages/four/index.ts

@@ -0,0 +1,49 @@
+// pages/four/index.ts
+Page({
+  /**
+   * 页面的初始数据
+   */
+  data: {},
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad() {},
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {},
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+    this.getTabBar().init()
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {},
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {},
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {},
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {},
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {},
+})

miniprogram/pages/four/index.wxml

@@ -0,0 +1,2 @@
+<!--pages/four/index.wxml-->
+<text>pages/four/index.wxml</text>

miniprogram/pages/one/index.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

miniprogram/pages/one/index.scss

@@ -0,0 +1 @@
+/* pages/one/index.wxss */

miniprogram/pages/one/index.ts

@@ -0,0 +1,49 @@
+// pages/one/index.ts
+Page({
+  /**
+   * 页面的初始数据
+   */
+  data: {},
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad() {},
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {},
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+    this.getTabBar().init()
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {},
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {},
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {},
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {},
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {},
+})

miniprogram/pages/one/index.wxml

@@ -0,0 +1,2 @@
+<!--pages/one/index.wxml-->
+<text>pages/one/index.wxml</text>

miniprogram/pages/three/index.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

miniprogram/pages/three/index.scss

@@ -0,0 +1 @@
+/* pages/three/index.wxss */

miniprogram/pages/three/index.ts

@@ -0,0 +1,49 @@
+// pages/three/index.ts
+Page({
+  /**
+   * 页面的初始数据
+   */
+  data: {},
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad() {},
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {},
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+    this.getTabBar().init()
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {},
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {},
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {},
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {},
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {},
+})

miniprogram/pages/three/index.wxml

@@ -0,0 +1,2 @@
+<!--pages/three/index.wxml-->
+<text>pages/three/index.wxml</text>

miniprogram/pages/two/index.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

miniprogram/pages/two/index.scss

@@ -0,0 +1 @@
+/* pages/two/index.wxss */

miniprogram/pages/two/index.ts

@@ -0,0 +1,49 @@
+// pages/two/index.ts
+Page({
+  /**
+   * 页面的初始数据
+   */
+  data: {},
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad() {},
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {},
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+    this.getTabBar().init()
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {},
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {},
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {},
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {},
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {},
+})

miniprogram/pages/two/index.wxml

@@ -0,0 +1,2 @@
+<!--pages/two/index.wxml-->
+<text>pages/two/index.wxml</text>